diff --git a/dist/css/material-design-light.css b/dist/css/material-design-light.css index 570f17f..c3067ee 100644 --- a/dist/css/material-design-light.css +++ b/dist/css/material-design-light.css @@ -6,7 +6,7 @@ * License, v. 2.0. If a copy of the MPL was not distributed with this * file, You can obtain one at https://mozilla.org/MPL/2.0/. */ -:root { + :root { --ml-font-sans-serif: "Roboto Flex", roboto, system-ui, -apple-system, blinkmacsystemfont, "Segoe UI", helvetica, arial, ubuntu, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji"; } diff --git a/dist/css/material-design-light.min.css b/dist/css/material-design-light.min.css index 28535e4..0416e03 100644 --- a/dist/css/material-design-light.min.css +++ b/dist/css/material-design-light.min.css @@ -6,4 +6,4 @@ * License, v. 2.0. If a copy of the MPL was not distributed with this * file, You can obtain one at https://mozilla.org/MPL/2.0/. */ -:root{--ml-font-sans-serif:"Roboto Flex", roboto, system-ui, -apple-system, blinkmacsystemfont, "Segoe UI", helvetica, arial, ubuntu, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji"}.ml-theme-dark,.ml-theme-light,body,body[data-ml-theme=dark]{--md-sys-color-shadow:#000;--md-sys-color-surface-tint-color:var(--md-sys-color-primary);--md-sys-color-surface-tint:var(--md-sys-color-primary)}.ml-theme-light,body{--md-sys-color-primary:#6750a4;--md-sys-color-primary-container:#eaddff;--md-sys-color-on-primary:#fff;--md-sys-color-on-primary-container:#21005d;--md-sys-color-inverse-primary:#d0bcff;--md-sys-color-secondary:#625b71;--md-sys-color-secondary-container:#e8def8;--md-sys-color-on-secondary:#fff;--md-sys-color-on-secondary-container:#1d192b;--md-sys-color-surface:#fffbfe;--md-sys-color-surface-variant:#e7e0ec;--md-sys-color-on-surface:#1c1b1f;--md-sys-color-on-surface-variant:#49454f;--md-sys-color-inverse-surface:#313033;--md-sys-color-inverse-on-surface:#f4eff4;--md-sys-color-background:#fffbfe;--md-sys-color-on-background:#1c1b1f;--md-sys-color-outline:#79747e;--md-sys-color-error:#b3261e;--md-sys-color-tertiary:#7d5260;--md-sys-color-tertiary-container:#ffd8e4;--md-sys-color-on-tertiary:#fff;--md-sys-color-on-tertiary-container:#31111d;--md-sys-color-error-container:#f9dedc;--md-sys-color-on-error:#fff;--md-sys-color-on-error-container:#410e0b}.ml-theme-dark,body[data-ml-theme=dark]{--md-sys-color-primary:#d0bcff;--md-sys-color-primary-container:#4f378b;--md-sys-color-on-primary:#381e72;--md-sys-color-on-primary-container:#eaddff;--md-sys-color-inverse-primary:#6750a4;--md-sys-color-secondary:#ccc2dc;--md-sys-color-secondary-container:#4a4458;--md-sys-color-on-secondary:#332d41;--md-sys-color-on-secondary-container:#e8def8;--md-sys-color-surface:#1c1b1f;--md-sys-color-surface-variant:#49454f;--md-sys-color-on-surface:#e6e1e5;--md-sys-color-on-surface-variant:#cac4d0;--md-sys-color-inverse-surface:#e6e1e5;--md-sys-color-inverse-on-surface:#313033;--md-sys-color-background:#1c1b1f;--md-sys-color-on-background:#e6e1e5;--md-sys-color-outline:#938f99;--md-sys-color-error:#f2b8b5;--md-sys-color-tertiary:#efb8c8;--md-sys-color-tertiary-container:#633b48;--md-sys-color-on-tertiary:#492532;--md-sys-color-on-tertiary-container:#ffd8e4;--md-sys-color-error-container:#8c1d18;--md-sys-color-on-error:#601410;--md-sys-color-on-error-container:#f2b8b5}body{background:var(--md-sys-color-background)}.container,.container-fluid,.container-lg,.container-md,.container-sm,.container-xl,.container-xxl{--ml-gutter-x:1.5rem;--ml-gutter-y:0;width:100%;padding-right:calc(var(--ml-gutter-x)*.5);padding-left:calc(var(--ml-gutter-x)*.5);margin-right:auto;margin-left:auto}@media (min-width:576px){.container,.container-sm{max-width:540px}}@media (min-width:768px){.container,.container-md,.container-sm{max-width:720px}}@media (min-width:992px){.container,.container-lg,.container-md,.container-sm{max-width:960px}}@media (min-width:1200px){.container,.container-lg,.container-md,.container-sm,.container-xl{max-width:1140px}}@media (min-width:1400px){.container,.container-lg,.container-md,.container-sm,.container-xl,.container-xxl{max-width:1320px}}.row{--ml-gutter-x:1.5rem;--ml-gutter-y:0;display:flex;flex-wrap:wrap;margin-top:calc(-1*var(--ml-gutter-y));margin-right:calc(-.5*var(--ml-gutter-x));margin-left:calc(-.5*var(--ml-gutter-x))}.row>*{box-sizing:border-box;flex-shrink:0;width:100%;max-width:100%;padding-right:calc(var(--ml-gutter-x)*.5);padding-left:calc(var(--ml-gutter-x)*.5);margin-top:var(--ml-gutter-y)}.col{flex:1 0 0}.row-cols-auto>*{flex:0 0 auto;width:auto}.row-cols-1>*{flex:0 0 auto;width:100%}.row-cols-2>*{flex:0 0 auto;width:50%}.row-cols-3>*{flex:0 0 auto;width:33.3333333333%}.row-cols-4>*{flex:0 0 auto;width:25%}.row-cols-5>*{flex:0 0 auto;width:20%}.col-auto,.row-cols-6>*{flex:0 0 auto;width:16.6666666667%}.col-auto{width:auto}.col-1,.col-2{flex:0 0 auto;width:8.3333333333%}.col-2{width:16.6666666667%}.col-3,.col-4{flex:0 0 auto;width:25%}.col-4{width:33.3333333333%}.col-5,.col-6{flex:0 0 auto;width:41.6666666667%}.col-6{width:50%}.col-7,.col-8{flex:0 0 auto;width:58.3333333333%}.col-8{width:66.6666666667%}.col-10,.col-9{flex:0 0 auto;width:75%}.col-10{width:83.3333333333%}.col-11,.col-12{flex:0 0 auto;width:91.6666666667%}.col-12{width:100%}.offset-1{margin-left:8.3333333333%}.offset-2{margin-left:16.6666666667%}.offset-3{margin-left:25%}.offset-4{margin-left:33.3333333333%}.offset-5{margin-left:41.6666666667%}.offset-6{margin-left:50%}.offset-7{margin-left:58.3333333333%}.offset-8{margin-left:66.6666666667%}.offset-9{margin-left:75%}.offset-10{margin-left:83.3333333333%}.offset-11{margin-left:91.6666666667%}.g-0,.gx-0{--ml-gutter-x:0}.g-0,.gy-0{--ml-gutter-y:0}.g-1,.gx-1{--ml-gutter-x:0.25rem}.g-1,.gy-1{--ml-gutter-y:0.25rem}.g-2,.gx-2{--ml-gutter-x:0.5rem}.g-2,.gy-2{--ml-gutter-y:0.5rem}.g-3,.gx-3{--ml-gutter-x:1rem}.g-3,.gy-3{--ml-gutter-y:1rem}.g-4,.gx-4{--ml-gutter-x:1.5rem}.g-4,.gy-4{--ml-gutter-y:1.5rem}.g-5,.gx-5{--ml-gutter-x:3rem}.g-5,.gy-5{--ml-gutter-y:3rem}@media (min-width:576px){.col-sm{flex:1 0 0}.row-cols-sm-auto>*{flex:0 0 auto;width:auto}.row-cols-sm-1>*{flex:0 0 auto;width:100%}.row-cols-sm-2>*{flex:0 0 auto;width:50%}.row-cols-sm-3>*{flex:0 0 auto;width:33.3333333333%}.row-cols-sm-4>*{flex:0 0 auto;width:25%}.row-cols-sm-5>*{flex:0 0 auto;width:20%}.col-sm-auto,.row-cols-sm-6>*{flex:0 0 auto;width:16.6666666667%}.col-sm-auto{width:auto}.col-sm-1,.col-sm-2{flex:0 0 auto;width:8.3333333333%}.col-sm-2{width:16.6666666667%}.col-sm-3,.col-sm-4{flex:0 0 auto;width:25%}.col-sm-4{width:33.3333333333%}.col-sm-5,.col-sm-6{flex:0 0 auto;width:41.6666666667%}.col-sm-6{width:50%}.col-sm-7,.col-sm-8{flex:0 0 auto;width:58.3333333333%}.col-sm-8{width:66.6666666667%}.col-sm-10,.col-sm-9{flex:0 0 auto;width:75%}.col-sm-10{width:83.3333333333%}.col-sm-11,.col-sm-12{flex:0 0 auto;width:91.6666666667%}.col-sm-12{width:100%}.offset-sm-0{margin-left:0}.offset-sm-1{margin-left:8.3333333333%}.offset-sm-2{margin-left:16.6666666667%}.offset-sm-3{margin-left:25%}.offset-sm-4{margin-left:33.3333333333%}.offset-sm-5{margin-left:41.6666666667%}.offset-sm-6{margin-left:50%}.offset-sm-7{margin-left:58.3333333333%}.offset-sm-8{margin-left:66.6666666667%}.offset-sm-9{margin-left:75%}.offset-sm-10{margin-left:83.3333333333%}.offset-sm-11{margin-left:91.6666666667%}.g-sm-0,.gx-sm-0{--ml-gutter-x:0}.g-sm-0,.gy-sm-0{--ml-gutter-y:0}.g-sm-1,.gx-sm-1{--ml-gutter-x:0.25rem}.g-sm-1,.gy-sm-1{--ml-gutter-y:0.25rem}.g-sm-2,.gx-sm-2{--ml-gutter-x:0.5rem}.g-sm-2,.gy-sm-2{--ml-gutter-y:0.5rem}.g-sm-3,.gx-sm-3{--ml-gutter-x:1rem}.g-sm-3,.gy-sm-3{--ml-gutter-y:1rem}.g-sm-4,.gx-sm-4{--ml-gutter-x:1.5rem}.g-sm-4,.gy-sm-4{--ml-gutter-y:1.5rem}.g-sm-5,.gx-sm-5{--ml-gutter-x:3rem}.g-sm-5,.gy-sm-5{--ml-gutter-y:3rem}}@media (min-width:768px){.col-md{flex:1 0 0}.row-cols-md-auto>*{flex:0 0 auto;width:auto}.row-cols-md-1>*{flex:0 0 auto;width:100%}.row-cols-md-2>*{flex:0 0 auto;width:50%}.row-cols-md-3>*{flex:0 0 auto;width:33.3333333333%}.row-cols-md-4>*{flex:0 0 auto;width:25%}.row-cols-md-5>*{flex:0 0 auto;width:20%}.col-md-auto,.row-cols-md-6>*{flex:0 0 auto;width:16.6666666667%}.col-md-auto{width:auto}.col-md-1,.col-md-2{flex:0 0 auto;width:8.3333333333%}.col-md-2{width:16.6666666667%}.col-md-3,.col-md-4{flex:0 0 auto;width:25%}.col-md-4{width:33.3333333333%}.col-md-5,.col-md-6{flex:0 0 auto;width:41.6666666667%}.col-md-6{width:50%}.col-md-7,.col-md-8{flex:0 0 auto;width:58.3333333333%}.col-md-8{width:66.6666666667%}.col-md-10,.col-md-9{flex:0 0 auto;width:75%}.col-md-10{width:83.3333333333%}.col-md-11,.col-md-12{flex:0 0 auto;width:91.6666666667%}.col-md-12{width:100%}.offset-md-0{margin-left:0}.offset-md-1{margin-left:8.3333333333%}.offset-md-2{margin-left:16.6666666667%}.offset-md-3{margin-left:25%}.offset-md-4{margin-left:33.3333333333%}.offset-md-5{margin-left:41.6666666667%}.offset-md-6{margin-left:50%}.offset-md-7{margin-left:58.3333333333%}.offset-md-8{margin-left:66.6666666667%}.offset-md-9{margin-left:75%}.offset-md-10{margin-left:83.3333333333%}.offset-md-11{margin-left:91.6666666667%}.g-md-0,.gx-md-0{--ml-gutter-x:0}.g-md-0,.gy-md-0{--ml-gutter-y:0}.g-md-1,.gx-md-1{--ml-gutter-x:0.25rem}.g-md-1,.gy-md-1{--ml-gutter-y:0.25rem}.g-md-2,.gx-md-2{--ml-gutter-x:0.5rem}.g-md-2,.gy-md-2{--ml-gutter-y:0.5rem}.g-md-3,.gx-md-3{--ml-gutter-x:1rem}.g-md-3,.gy-md-3{--ml-gutter-y:1rem}.g-md-4,.gx-md-4{--ml-gutter-x:1.5rem}.g-md-4,.gy-md-4{--ml-gutter-y:1.5rem}.g-md-5,.gx-md-5{--ml-gutter-x:3rem}.g-md-5,.gy-md-5{--ml-gutter-y:3rem}}@media (min-width:992px){.col-lg{flex:1 0 0}.row-cols-lg-auto>*{flex:0 0 auto;width:auto}.row-cols-lg-1>*{flex:0 0 auto;width:100%}.row-cols-lg-2>*{flex:0 0 auto;width:50%}.row-cols-lg-3>*{flex:0 0 auto;width:33.3333333333%}.row-cols-lg-4>*{flex:0 0 auto;width:25%}.row-cols-lg-5>*{flex:0 0 auto;width:20%}.col-lg-auto,.row-cols-lg-6>*{flex:0 0 auto;width:16.6666666667%}.col-lg-auto{width:auto}.col-lg-1,.col-lg-2{flex:0 0 auto;width:8.3333333333%}.col-lg-2{width:16.6666666667%}.col-lg-3,.col-lg-4{flex:0 0 auto;width:25%}.col-lg-4{width:33.3333333333%}.col-lg-5,.col-lg-6{flex:0 0 auto;width:41.6666666667%}.col-lg-6{width:50%}.col-lg-7,.col-lg-8{flex:0 0 auto;width:58.3333333333%}.col-lg-8{width:66.6666666667%}.col-lg-10,.col-lg-9{flex:0 0 auto;width:75%}.col-lg-10{width:83.3333333333%}.col-lg-11,.col-lg-12{flex:0 0 auto;width:91.6666666667%}.col-lg-12{width:100%}.offset-lg-0{margin-left:0}.offset-lg-1{margin-left:8.3333333333%}.offset-lg-2{margin-left:16.6666666667%}.offset-lg-3{margin-left:25%}.offset-lg-4{margin-left:33.3333333333%}.offset-lg-5{margin-left:41.6666666667%}.offset-lg-6{margin-left:50%}.offset-lg-7{margin-left:58.3333333333%}.offset-lg-8{margin-left:66.6666666667%}.offset-lg-9{margin-left:75%}.offset-lg-10{margin-left:83.3333333333%}.offset-lg-11{margin-left:91.6666666667%}.g-lg-0,.gx-lg-0{--ml-gutter-x:0}.g-lg-0,.gy-lg-0{--ml-gutter-y:0}.g-lg-1,.gx-lg-1{--ml-gutter-x:0.25rem}.g-lg-1,.gy-lg-1{--ml-gutter-y:0.25rem}.g-lg-2,.gx-lg-2{--ml-gutter-x:0.5rem}.g-lg-2,.gy-lg-2{--ml-gutter-y:0.5rem}.g-lg-3,.gx-lg-3{--ml-gutter-x:1rem}.g-lg-3,.gy-lg-3{--ml-gutter-y:1rem}.g-lg-4,.gx-lg-4{--ml-gutter-x:1.5rem}.g-lg-4,.gy-lg-4{--ml-gutter-y:1.5rem}.g-lg-5,.gx-lg-5{--ml-gutter-x:3rem}.g-lg-5,.gy-lg-5{--ml-gutter-y:3rem}}@media (min-width:1200px){.col-xl{flex:1 0 0}.row-cols-xl-auto>*{flex:0 0 auto;width:auto}.row-cols-xl-1>*{flex:0 0 auto;width:100%}.row-cols-xl-2>*{flex:0 0 auto;width:50%}.row-cols-xl-3>*{flex:0 0 auto;width:33.3333333333%}.row-cols-xl-4>*{flex:0 0 auto;width:25%}.row-cols-xl-5>*{flex:0 0 auto;width:20%}.col-xl-auto,.row-cols-xl-6>*{flex:0 0 auto;width:16.6666666667%}.col-xl-auto{width:auto}.col-xl-1,.col-xl-2{flex:0 0 auto;width:8.3333333333%}.col-xl-2{width:16.6666666667%}.col-xl-3,.col-xl-4{flex:0 0 auto;width:25%}.col-xl-4{width:33.3333333333%}.col-xl-5,.col-xl-6{flex:0 0 auto;width:41.6666666667%}.col-xl-6{width:50%}.col-xl-7,.col-xl-8{flex:0 0 auto;width:58.3333333333%}.col-xl-8{width:66.6666666667%}.col-xl-10,.col-xl-9{flex:0 0 auto;width:75%}.col-xl-10{width:83.3333333333%}.col-xl-11,.col-xl-12{flex:0 0 auto;width:91.6666666667%}.col-xl-12{width:100%}.offset-xl-0{margin-left:0}.offset-xl-1{margin-left:8.3333333333%}.offset-xl-2{margin-left:16.6666666667%}.offset-xl-3{margin-left:25%}.offset-xl-4{margin-left:33.3333333333%}.offset-xl-5{margin-left:41.6666666667%}.offset-xl-6{margin-left:50%}.offset-xl-7{margin-left:58.3333333333%}.offset-xl-8{margin-left:66.6666666667%}.offset-xl-9{margin-left:75%}.offset-xl-10{margin-left:83.3333333333%}.offset-xl-11{margin-left:91.6666666667%}.g-xl-0,.gx-xl-0{--ml-gutter-x:0}.g-xl-0,.gy-xl-0{--ml-gutter-y:0}.g-xl-1,.gx-xl-1{--ml-gutter-x:0.25rem}.g-xl-1,.gy-xl-1{--ml-gutter-y:0.25rem}.g-xl-2,.gx-xl-2{--ml-gutter-x:0.5rem}.g-xl-2,.gy-xl-2{--ml-gutter-y:0.5rem}.g-xl-3,.gx-xl-3{--ml-gutter-x:1rem}.g-xl-3,.gy-xl-3{--ml-gutter-y:1rem}.g-xl-4,.gx-xl-4{--ml-gutter-x:1.5rem}.g-xl-4,.gy-xl-4{--ml-gutter-y:1.5rem}.g-xl-5,.gx-xl-5{--ml-gutter-x:3rem}.g-xl-5,.gy-xl-5{--ml-gutter-y:3rem}}@media (min-width:1400px){.col-xxl{flex:1 0 0}.row-cols-xxl-auto>*{flex:0 0 auto;width:auto}.row-cols-xxl-1>*{flex:0 0 auto;width:100%}.row-cols-xxl-2>*{flex:0 0 auto;width:50%}.row-cols-xxl-3>*{flex:0 0 auto;width:33.3333333333%}.row-cols-xxl-4>*{flex:0 0 auto;width:25%}.row-cols-xxl-5>*{flex:0 0 auto;width:20%}.row-cols-xxl-6>*{flex:0 0 auto;width:16.6666666667%}.col-xxl-auto{flex:0 0 auto;width:auto}.col-xxl-1,.col-xxl-2{flex:0 0 auto;width:8.3333333333%}.col-xxl-2{width:16.6666666667%}.col-xxl-3,.col-xxl-4{flex:0 0 auto;width:25%}.col-xxl-4{width:33.3333333333%}.col-xxl-5,.col-xxl-6{flex:0 0 auto;width:41.6666666667%}.col-xxl-6{width:50%}.col-xxl-7,.col-xxl-8{flex:0 0 auto;width:58.3333333333%}.col-xxl-8{width:66.6666666667%}.col-xxl-10,.col-xxl-9{flex:0 0 auto;width:75%}.col-xxl-10{width:83.3333333333%}.col-xxl-11,.col-xxl-12{flex:0 0 auto;width:91.6666666667%}.col-xxl-12{width:100%}.offset-xxl-0{margin-left:0}.offset-xxl-1{margin-left:8.3333333333%}.offset-xxl-2{margin-left:16.6666666667%}.offset-xxl-3{margin-left:25%}.offset-xxl-4{margin-left:33.3333333333%}.offset-xxl-5{margin-left:41.6666666667%}.offset-xxl-6{margin-left:50%}.offset-xxl-7{margin-left:58.3333333333%}.offset-xxl-8{margin-left:66.6666666667%}.offset-xxl-9{margin-left:75%}.offset-xxl-10{margin-left:83.3333333333%}.offset-xxl-11{margin-left:91.6666666667%}.g-xxl-0,.gx-xxl-0{--ml-gutter-x:0}.g-xxl-0,.gy-xxl-0{--ml-gutter-y:0}.g-xxl-1,.gx-xxl-1{--ml-gutter-x:0.25rem}.g-xxl-1,.gy-xxl-1{--ml-gutter-y:0.25rem}.g-xxl-2,.gx-xxl-2{--ml-gutter-x:0.5rem}.g-xxl-2,.gy-xxl-2{--ml-gutter-y:0.5rem}.g-xxl-3,.gx-xxl-3{--ml-gutter-x:1rem}.g-xxl-3,.gy-xxl-3{--ml-gutter-y:1rem}.g-xxl-4,.gx-xxl-4{--ml-gutter-x:1.5rem}.g-xxl-4,.gy-xxl-4{--ml-gutter-y:1.5rem}.g-xxl-5,.gx-xxl-5{--ml-gutter-x:3rem}.g-xxl-5,.gy-xxl-5{--ml-gutter-y:3rem}}.group{display:flex}.group-inline{display:inline-flex}.card{box-sizing:border-box;transition-property:background-color,box-shadow;transition-duration:150ms;transition-timing-function:cubic-bezier(.4,0,.2,1)}.card,.card-image-top{border-radius:.75rem}.card-elevated{background:#f7f2fa;box-shadow:0 .0625rem .125rem 0 rgba(0,0,0,.3),0 .0625rem .1875rem .0625rem rgba(0,0,0,.15)}.card-elevated:hover:not(:disabled).card-hover{background:#e2dce6;box-shadow:0 .0625rem .125rem 0 rgba(0,0,0,.3),0 .125rem .375rem .125rem rgba(0,0,0,.15)}.ml-theme-dark .card-elevated,body[data-ml-theme=dark] .card-elevated{background:#25232a;box-shadow:0 .0625rem .125rem 0 rgba(0,0,0,.3),0 .0625rem .1875rem .0625rem rgba(0,0,0,.15)}.ml-theme-dark .card-elevated:hover:not(:disabled).card-hover,body[data-ml-theme=dark] .card-elevated:hover:not(:disabled).card-hover{background:#39373f;box-shadow:0 .0625rem .125rem 0 rgba(0,0,0,.3),0 .125rem .375rem .125rem rgba(0,0,0,.15)}.card-filled{background:#e7e0ec}.card-filled:hover:not(:disabled).card-hover{background:#d1cad8;box-shadow:0 .0625rem .125rem 0 rgba(0,0,0,.3),0 .0625rem .1875rem .0625rem rgba(0,0,0,.15)}.ml-theme-dark .card-filled,body[data-ml-theme=dark] .card-filled{background:#49454f}.ml-theme-dark .card-filled:hover:not(:disabled).card-hover,body[data-ml-theme=dark] .card-filled:hover:not(:disabled).card-hover{background:#5c5763;box-shadow:0 .0625rem .125rem 0 rgba(0,0,0,.3),0 .0625rem .1875rem .0625rem rgba(0,0,0,.15)}.card-outlined{background:#fffbfe;border:solid thin #79747e}.card-outlined:hover:not(:disabled).card-hover,.ml-theme-dark .card-outlined:hover:not(:disabled).card-hover,body[data-ml-theme=dark] .card-outlined:hover:not(:disabled).card-hover{box-shadow:0 .0625rem .125rem 0 rgba(0,0,0,.3),0 .0625rem .1875rem .0625rem rgba(0,0,0,.15)}.ml-theme-dark .card-outlined,body[data-ml-theme=dark] .card-outlined{background:#1c1b1f;border:solid thin #938f99}.card-image,.card-image-top{width:100%}.card-body{padding:0 1rem}.nav-drawer{background:#fffbfe;border-radius:0 1rem 1rem 0;width:22.5rem;padding:.75rem 0;box-sizing:border-box}.nav-drawer .nav-drawer-headline{color:#49454f;margin:0;padding:1rem 1.75rem}.nav-drawer .nav-drawer-break{height:.0625rem;margin:0 1.75rem;border:0;background:#49454f}.nav-drawer .nav-drawer-item{-webkit-tap-highlight-color:transparent;display:flex;height:3.5rem;padding:0 1.5rem 0 1rem;margin:0 .75rem;gap:.75rem;border-radius:1.75rem;align-items:center;background:#fffbfe;color:#49454f;font-family:var(--ml-font-sans-serif);font-size:.875rem;line-height:1.25rem;letter-spacing:.00625rem;font-weight:500;text-decoration:none;box-sizing:border-box;transition-property:background-color,color;transition-duration:150ms;transition-timing-function:cubic-bezier(.4,0,.2,1)}.nav-drawer .nav-drawer-item:focus-visible{outline:0}.nav-drawer .nav-drawer-item:disabled{cursor:auto}.nav-drawer .nav-drawer-item.nav-drawer-item-active{background:#e8def8;color:#1d192b}.nav-drawer .nav-drawer-item:hover:not(:disabled){background:#ede9ec;color:#1c1b1f}.nav-drawer .nav-drawer-item:hover:not(:disabled).nav-drawer-item-active{background:#ede9ed;color:#1d192b}.nav-drawer .nav-drawer-item:focus-visible:not(:disabled){background:#e4e0e3;color:#1c1b1f}.nav-drawer .nav-drawer-item:focus-visible:not(:disabled).nav-drawer-item-active{background:#e4e0e5;color:#1d192b}.nav-drawer .nav-drawer-item.nav-drawer-item-active:active:not(:disabled),.nav-drawer .nav-drawer-item:active:not(:disabled){background:#e4e0e5;color:#1c1b1f}.nav-drawer .nav-drawer-item.nav-drawer-item-active:active:not(:disabled).nav-drawer-item-active,.nav-drawer .nav-drawer-item:active:not(:disabled).nav-drawer-item-active{color:#1d192b}.nav-drawer .nav-drawer-item .nav-drawer-item-icon{font-size:1.5rem}.ml-theme-dark .nav-drawer,body[data-ml-theme=dark] .nav-drawer{background:#1c1b1f}.ml-theme-dark .nav-drawer .nav-drawer-headline,body[data-ml-theme=dark] .nav-drawer .nav-drawer-headline{color:#cac4d0}.ml-theme-dark .nav-drawer .nav-drawer-item,body[data-ml-theme=dark] .nav-drawer .nav-drawer-item{background:#1c1b1f;color:#cac4d0}.ml-theme-dark .nav-drawer .nav-drawer-item.nav-drawer-item-active,body[data-ml-theme=dark] .nav-drawer .nav-drawer-item.nav-drawer-item-active{background:#4a4458;color:#e8def8}.ml-theme-dark .nav-drawer .nav-drawer-item:hover:not(:disabled),body[data-ml-theme=dark] .nav-drawer .nav-drawer-item:hover:not(:disabled){background:#2c2b2f;color:#e6e1e5}.ml-theme-dark .nav-drawer .nav-drawer-item:hover:not(:disabled).nav-drawer-item-active,body[data-ml-theme=dark] .nav-drawer .nav-drawer-item:hover:not(:disabled).nav-drawer-item-active{background:#2c2b30;color:#e8def8}.ml-theme-dark .nav-drawer .nav-drawer-item:focus-visible:not(:disabled),body[data-ml-theme=dark] .nav-drawer .nav-drawer-item:focus-visible:not(:disabled){background:#343337;color:#e6e1e5}.ml-theme-dark .nav-drawer .nav-drawer-item:focus-visible:not(:disabled).nav-drawer-item-active,body[data-ml-theme=dark] .nav-drawer .nav-drawer-item:focus-visible:not(:disabled).nav-drawer-item-active{background:#343239;color:#e8def8}.ml-theme-dark .nav-drawer .nav-drawer-item:active:not(:disabled),body[data-ml-theme=dark] .nav-drawer .nav-drawer-item:active:not(:disabled){background:#343239;color:#e6e1e5}.ml-theme-dark .nav-drawer .nav-drawer-item:active:not(:disabled).nav-drawer-item-active,body[data-ml-theme=dark] .nav-drawer .nav-drawer-item:active:not(:disabled).nav-drawer-item-active{color:#e8def8}.nav-drawer-modal{background:#f7f2fa;border-radius:0 1rem 1rem 0;width:22.5rem;padding:.75rem 0;box-sizing:border-box;position:fixed;height:100vh}.nav-drawer-modal .nav-drawer-modal-headline{color:#49454f;margin:0;padding:1rem 1.75rem}.nav-drawer-modal .nav-drawer-modal-break{height:.0625rem;margin:0 1.75rem;border:0;background:#49454f}.nav-drawer-modal .nav-drawer-modal-item{-webkit-tap-highlight-color:transparent;display:flex;height:3.5rem;padding:0 1.5rem 0 1rem;margin:0 .75rem;gap:.75rem;border-radius:1.75rem;align-items:center;background:#f7f2fa;color:#49454f;font-family:var(--ml-font-sans-serif);font-size:.875rem;line-height:1.25rem;letter-spacing:.00625rem;font-weight:500;text-decoration:none;box-sizing:border-box;transition-property:background-color,color;transition-duration:150ms;transition-timing-function:cubic-bezier(.4,0,.2,1)}.nav-drawer-modal .nav-drawer-modal-item:focus-visible{outline:0}.nav-drawer-modal .nav-drawer-modal-item:disabled{cursor:auto}.nav-drawer-modal .nav-drawer-modal-item.nav-drawer-modal-item-active{background:#e2d7f4;color:#1d192b}.nav-drawer-modal .nav-drawer-modal-item:hover:not(:disabled){background:#e5e1e8;color:#1c1b1f}.nav-drawer-modal .nav-drawer-modal-item:hover:not(:disabled).nav-drawer-modal-item-active{background:#e6e1e9;color:#1d192b}.nav-drawer-modal .nav-drawer-modal-item:focus-visible:not(:disabled){background:#ddd8e0;color:#1c1b1f}.nav-drawer-modal .nav-drawer-modal-item:focus-visible:not(:disabled).nav-drawer-modal-item-active{background:#ddd8e1;color:#1d192b}.nav-drawer-modal .nav-drawer-modal-item.nav-drawer-modal-item-active:active:not(:disabled),.nav-drawer-modal .nav-drawer-modal-item:active:not(:disabled){background:#ddd8e1;color:#1c1b1f}.nav-drawer-modal .nav-drawer-modal-item.nav-drawer-modal-item-active:active:not(:disabled).nav-drawer-modal-item-active,.nav-drawer-modal .nav-drawer-modal-item:active:not(:disabled).nav-drawer-modal-item-active{color:#1d192b}.nav-drawer-modal .nav-drawer-modal-item .nav-drawer-modal-item-icon{font-size:1.5rem}.ml-theme-dark .nav-drawer-modal,body[data-ml-theme=dark] .nav-drawer-modal{background:#25232a}.ml-theme-dark .nav-drawer-modal .nav-drawer-modal-headline,body[data-ml-theme=dark] .nav-drawer-modal .nav-drawer-modal-headline{color:#cac4d0}.ml-theme-dark .nav-drawer-modal .nav-drawer-modal-item,body[data-ml-theme=dark] .nav-drawer-modal .nav-drawer-modal-item{background:#25232a;color:#cac4d0}.ml-theme-dark .nav-drawer-modal .nav-drawer-modal-item.nav-drawer-modal-item-active,body[data-ml-theme=dark] .nav-drawer-modal .nav-drawer-modal-item.nav-drawer-modal-item-active{background:#514a60;color:#e8def8}.ml-theme-dark .nav-drawer-modal .nav-drawer-modal-item:hover:not(:disabled),body[data-ml-theme=dark] .nav-drawer-modal .nav-drawer-modal-item:hover:not(:disabled){background:#343239;color:#e6e1e5}.ml-theme-dark .nav-drawer-modal .nav-drawer-modal-item:hover:not(:disabled).nav-drawer-modal-item-active,body[data-ml-theme=dark] .nav-drawer-modal .nav-drawer-modal-item:hover:not(:disabled).nav-drawer-modal-item-active{background:#35323a;color:#e8def8}.ml-theme-dark .nav-drawer-modal .nav-drawer-modal-item:focus-visible:not(:disabled),body[data-ml-theme=dark] .nav-drawer-modal .nav-drawer-modal-item:focus-visible:not(:disabled){background:#3c3a40;color:#e6e1e5}.ml-theme-dark .nav-drawer-modal .nav-drawer-modal-item:focus-visible:not(:disabled).nav-drawer-modal-item-active,body[data-ml-theme=dark] .nav-drawer-modal .nav-drawer-modal-item:focus-visible:not(:disabled).nav-drawer-modal-item-active{background:#3c3943;color:#e8def8}.ml-theme-dark .nav-drawer-modal .nav-drawer-modal-item:active:not(:disabled),body[data-ml-theme=dark] .nav-drawer-modal .nav-drawer-modal-item:active:not(:disabled){background:#3c3943;color:#e6e1e5}.ml-theme-dark .nav-drawer-modal .nav-drawer-modal-item:active:not(:disabled).nav-drawer-modal-item-active,body[data-ml-theme=dark] .nav-drawer-modal .nav-drawer-modal-item:active:not(:disabled).nav-drawer-modal-item-active{color:#e8def8}.button{-webkit-tap-highlight-color:transparent;display:inline-flex;justify-content:center;align-items:center;gap:.5em;white-space:nowrap;border:0;cursor:pointer;text-decoration:none;font-family:var(--ml-font-sans-serif);font-size:.875rem;line-height:1.25rem;letter-spacing:.00625rem;font-weight:500;height:2.5rem;border-radius:1.25rem;transition-property:background-color,box-shadow;transition-duration:150ms;transition-timing-function:cubic-bezier(.4,0,.2,1)}.button:focus-visible{outline:0}.button:disabled{cursor:auto}.button .button-icon{font-size:1.125rem}.button-elevated{color:#6750a4;background:#f7f2fa;padding:0 1.5rem;box-shadow:0 .0625rem .125rem 0 rgba(0,0,0,.3),0 .0625rem .1875rem .0625rem rgba(0,0,0,.15)}.button-elevated:disabled{color:rgba(28,27,31,.38);background:rgba(28,27,31,.12);box-shadow:unset}.button-elevated:hover:not(:disabled){background:#e8e0f0;box-shadow:0 .0625rem .125rem 0 rgba(0,0,0,.3),0 .125rem .375rem .125rem rgba(0,0,0,.15)}.button-elevated:focus-visible:not(:disabled){background:#e6dff0;box-shadow:0 .0625rem .125rem 0 rgba(0,0,0,.3),0 .0625rem .1875rem .0625rem rgba(0,0,0,.15)}.button-elevated:active:not(:disabled){background:#e6dff0;box-shadow:0 .0625rem .125rem 0 rgba(0,0,0,.3),0 .0625rem .1875rem .0625rem rgba(0,0,0,.15)}.ml-theme-dark .button-elevated,body[data-ml-theme=dark] .button-elevated{color:#d0bcff;background:#25232a;box-shadow:0 .0625rem .125rem 0 rgba(0,0,0,.3),0 .0625rem .1875rem .0625rem rgba(0,0,0,.15)}.ml-theme-dark .button-elevated:disabled,body[data-ml-theme=dark] .button-elevated:disabled{color:rgba(230,225,229,.38);background:rgba(230,225,229,.12);box-shadow:unset}.ml-theme-dark .button-elevated:hover:not(:disabled),body[data-ml-theme=dark] .button-elevated:hover:not(:disabled){background:#373441;box-shadow:0 .0625rem .125rem 0 rgba(0,0,0,.3),0 .125rem .375rem .125rem rgba(0,0,0,.15)}.ml-theme-dark .button-elevated:focus-visible:not(:disabled),body[data-ml-theme=dark] .button-elevated:focus-visible:not(:disabled){background:#3a3544;box-shadow:0 .0625rem .125rem 0 rgba(0,0,0,.3),0 .0625rem .1875rem .0625rem rgba(0,0,0,.15)}.ml-theme-dark .button-elevated:active:not(:disabled),body[data-ml-theme=dark] .button-elevated:active:not(:disabled){background:#3a3544;box-shadow:0 .0625rem .125rem 0 rgba(0,0,0,.3),0 .0625rem .1875rem .0625rem rgba(0,0,0,.15)}.button-elevated.button-with-icon{padding:0 1.5rem 0 1rem}.button-filled{color:#fff;background:#6750a4;padding:0 1.5rem;box-shadow:unset}.button-filled:disabled{color:rgba(28,27,31,.38);background:rgba(28,27,31,.12);box-shadow:unset}.button-filled:hover:not(:disabled){background:#735eab;box-shadow:0 .0625rem .125rem 0 rgba(0,0,0,.3),0 .0625rem .1875rem .0625rem rgba(0,0,0,.15)}.button-filled:focus-visible:not(:disabled){background:#7965af;box-shadow:unset}.button-filled:active:not(:disabled){background:#735eab;box-shadow:unset}.ml-theme-dark .button-filled,body[data-ml-theme=dark] .button-filled{color:#381e72;background:#d0bcff;box-shadow:unset}.ml-theme-dark .button-filled:disabled,body[data-ml-theme=dark] .button-filled:disabled{color:rgba(230,225,229,.38);background:rgba(230,225,229,.12);box-shadow:unset}.ml-theme-dark .button-filled:hover:not(:disabled),body[data-ml-theme=dark] .button-filled:hover:not(:disabled){background:#c4aff4;box-shadow:0 .0625rem .125rem 0 rgba(0,0,0,.3),0 .0625rem .1875rem .0625rem rgba(0,0,0,.15)}.ml-theme-dark .button-filled:focus-visible:not(:disabled),body[data-ml-theme=dark] .button-filled:focus-visible:not(:disabled){background:#bea9ee;box-shadow:unset}.ml-theme-dark .button-filled:active:not(:disabled),body[data-ml-theme=dark] .button-filled:active:not(:disabled){background:#c4aff4;box-shadow:unset}.button-tonal{color:#1d192b;background:#e8def8;padding:0 1.5rem;box-shadow:unset}.button-tonal:disabled{color:rgba(28,27,31,.38);background:rgba(28,27,31,.12);box-shadow:unset}.button-tonal:hover:not(:disabled){background:#d8cee8;box-shadow:0 .0625rem .125rem 0 rgba(0,0,0,.3),0 .0625rem .1875rem .0625rem rgba(0,0,0,.15)}.button-tonal:focus-visible:not(:disabled){background:#d0c6df;box-shadow:unset}.button-tonal:active:not(:disabled){background:#d0c6df;box-shadow:unset}.ml-theme-dark .button-tonal,body[data-ml-theme=dark] .button-tonal{color:#e8def8;background:#4a4458;box-shadow:unset}.ml-theme-dark .button-tonal:disabled,body[data-ml-theme=dark] .button-tonal:disabled{color:rgba(230,225,229,.38);background:rgba(230,225,229,.12);box-shadow:unset}.ml-theme-dark .button-tonal:hover:not(:disabled),body[data-ml-theme=dark] .button-tonal:hover:not(:disabled){background:#575065;box-shadow:0 .0625rem .125rem 0 rgba(0,0,0,.3),0 .0625rem .1875rem .0625rem rgba(0,0,0,.15)}.ml-theme-dark .button-tonal:focus-visible:not(:disabled),body[data-ml-theme=dark] .button-tonal:focus-visible:not(:disabled){background:#5d566b;box-shadow:unset}.ml-theme-dark .button-tonal:active:not(:disabled),body[data-ml-theme=dark] .button-tonal:active:not(:disabled){background:#5d566b;box-shadow:unset}.button-outlined{color:#6750a4;border:solid thin #79747e;background:0 0;padding:0 1.5rem}.button-outlined:disabled{color:rgba(28,27,31,.38);border-color:rgba(28,27,31,.12)}.button-outlined:hover:not(:disabled){background:rgba(103,80,164,.08)}.button-outlined:focus-visible:not(:disabled){border-color:#6750a4;background:rgba(103,80,164,.12)}.button-outlined:active:not(:disabled){background:rgba(103,80,164,.12)}.ml-theme-dark .button-outlined,body[data-ml-theme=dark] .button-outlined{color:#d0bcff;border:solid thin #938f99}.ml-theme-dark .button-outlined:disabled,body[data-ml-theme=dark] .button-outlined:disabled{color:rgba(230,225,229,.38);border-color:rgba(230,225,229,.12)}.ml-theme-dark .button-outlined:hover:not(:disabled),body[data-ml-theme=dark] .button-outlined:hover:not(:disabled){background:rgba(208,188,255,.08)}.ml-theme-dark .button-outlined:focus-visible:not(:disabled),body[data-ml-theme=dark] .button-outlined:focus-visible:not(:disabled){border-color:#d0bcff;background:rgba(208,188,255,.12)}.ml-theme-dark .button-outlined:active:not(:disabled),body[data-ml-theme=dark] .button-outlined:active:not(:disabled){background:rgba(208,188,255,.12)}.button-text{color:#6750a4;background:0 0;padding:0 .75rem}.button-text:disabled{color:rgba(28,27,31,.38)}.button-text:hover:not(:disabled){background:rgba(103,80,164,.08)}.button-text:focus-visible:not(:disabled){background:rgba(103,80,164,.12)}.button-text:active:not(:disabled){background:rgba(103,80,164,.12)}.ml-theme-dark .button-text,body[data-ml-theme=dark] .button-text{color:#d0bcff}.ml-theme-dark .button-text:disabled,body[data-ml-theme=dark] .button-text:disabled{color:rgba(230,225,229,.38)}.ml-theme-dark .button-text:hover:not(:disabled),body[data-ml-theme=dark] .button-text:hover:not(:disabled){background:rgba(208,188,255,.08)}.ml-theme-dark .button-text:focus-visible:not(:disabled),body[data-ml-theme=dark] .button-text:focus-visible:not(:disabled){background:rgba(208,188,255,.12)}.ml-theme-dark .button-text:active:not(:disabled),body[data-ml-theme=dark] .button-text:active:not(:disabled){background:rgba(208,188,255,.12)}.field-text{position:relative;height:3.5rem;box-sizing:border-box;transition-property:background-color;transition-duration:150ms;transition-timing-function:cubic-bezier(.4,0,.2,1)}.field-text .field-text-input{height:100%;width:100%;background:0 0;box-sizing:border-box;border:0;color:#1c1b1f;caret-color:#6750a4;font-family:"Roboto Flex",roboto,system-ui,-apple-system,blinkmacsystemfont,"Segoe UI",helvetica,arial,ubuntu,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji";line-height:1.5rem;font-size:1rem;font-weight:400;letter-spacing:.03125rem}.field-text .field-text-input:focus{outline:0}.field-text .field-text-input::placeholder{color:#49454f}.field-text.field-text-filled{background:#e7e0ec;border-radius:.25rem .25rem 0 0}.field-text.field-text-filled .field-text-input{padding:1.25rem 1rem .5rem}.field-text.field-text-outlined .field-text-input{padding:0 1rem}.field-text.field-text-outlined .field-text-label{background:inherit;z-index:1}.field-text.field-text-filled::after{content:" ";position:absolute;left:0;bottom:0;width:100%;border-bottom:.0625rem solid #49454f;transition-property:border-color,border-width;transition-duration:150ms;transition-timing-function:cubic-bezier(.4,0,.2,1);user-select:none;pointer-events:none}.field-text.field-text-outlined::after{content:" ";top:0;left:0;width:100%;height:100%;border:.0625rem solid #79747e;border-radius:.25rem;transition-property:border-color,border-width;box-sizing:border-box}.field-text .field-text-icon-leading{position:absolute;top:50%;left:.75rem;transform:translateY(-50%);user-select:none;pointer-events:none;color:#49454f;font-size:1.5rem;line-height:0}.field-text .field-text-icon-trailing,.field-text .field-text-label,.field-text.field-text-outlined::after{position:absolute;user-select:none;pointer-events:none;transition-duration:150ms;transition-timing-function:cubic-bezier(.4,0,.2,1)}.field-text .field-text-icon-trailing,.field-text .field-text-label{top:50%;transform:translateY(-50%);color:#49454f}.field-text .field-text-label{left:1rem;margin-right:1rem;font-family:"Roboto Flex",roboto,system-ui,-apple-system,blinkmacsystemfont,"Segoe UI",helvetica,arial,ubuntu,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji";line-height:1.5rem;font-size:1rem;font-weight:400;letter-spacing:.03125rem;transition-property:color,transform,top,font-size,line-height,left,padding}.field-text .field-text-icon-trailing{right:.75rem;font-size:1.5rem;line-height:0;transition-property:color}.field-text:has(>.field-text-icon-leading) .field-text-input{padding-left:3.25rem}.field-text:has(>.field-text-icon-leading).field-text-filled .field-text-label,.field-text:has(>.field-text-input:placeholder-shown):has(>.field-text-input:not(:focus)):has(>.field-text-icon-leading).field-text-outlined .field-text-label{left:3.25rem}.field-text:has(>.field-text-icon-trailing) .field-text-input{padding-right:3.25rem}.field-text:has(>.field-text-icon-trailing) .field-text-label{margin-right:3.25rem}.field-text .field-text-input:-webkit-autofill,.field-text .field-text-input:-webkit-autofill:focus{transition:background-color 2147483647s 0s,color 2147483647s 0s!important}.field-text:has(>.field-text-input:disabled).field-text-filled{background:rgba(28,27,31,.04)}.field-text:has(>.field-text-input:disabled).field-text-filled::after{border-color:rgba(28,27,31,.38)}.field-text:has(>.field-text-input:disabled) .field-text-icon-leading,.field-text:has(>.field-text-input:disabled) .field-text-icon-trailing,.field-text:has(>.field-text-input:disabled) .field-text-input,.field-text:has(>.field-text-input:disabled) .field-text-label{color:rgba(28,27,31,.38)}.field-text:focus-within:not(:has(>.field-text-input:disabled)).field-text-filled .field-text-label,.field-text:has(>.field-text-input:not(:placeholder-shown)).field-text-filled .field-text-label{top:.5rem}.field-text:focus-within:not(:has(>.field-text-input:disabled)).field-text-outlined .field-text-label,.field-text:has(>.field-text-input:not(:placeholder-shown)).field-text-outlined .field-text-label{top:-.475rem;padding:0 .25rem}.field-text:focus-within:not(:has(>.field-text-input:disabled)) .field-text-label,.field-text:has(>.field-text-input:not(:placeholder-shown)) .field-text-label{transform:translateY(0);line-height:1rem;font-size:.75rem}.field-text:focus-within:not(:has(>.field-text-input:disabled)).field-text-filled::after{border-bottom:.125rem solid #6750a4}.field-text:focus-within:not(:has(>.field-text-input:disabled)).field-text-outlined::after{border-width:.125rem;border-color:#6750a4}.field-text:focus-within:not(:has(>.field-text-input:disabled)) .field-text-label{color:#6750a4}.field-text:hover:not(:has(>.field-text-input:disabled)):not(:focus-within).field-text-filled{background:#d7d0dc}.field-text:hover:not(:has(>.field-text-input:disabled)):not(:focus-within).field-text-outlined::after{border-color:#6750a4}.field-text:hover:not(:has(>.field-text-input:disabled)):not(:focus-within).field-text-outlined .field-text-label{color:#1c1b1f}.field-text:not(:has(>.field-text-input:disabled)):has(>.field-text-input:invalid)::after{border-color:#b3261e}.field-text:not(:has(>.field-text-input:disabled)):has(>.field-text-input:invalid) .field-text-icon-trailing,.field-text:not(:has(>.field-text-input:disabled)):has(>.field-text-input:invalid) .field-text-label{color:#b3261e}.field-text:not(:has(>.field-text-input:disabled)):has(>.field-text-input:invalid) .field-text-input{caret-color:#b3261e}.field-text:not(:has(>.field-text-input:disabled)):has(>.field-text-input:invalid):hover:not(:has(>.field-text-input:disabled)):not(:focus-within).field-text-filled{background:#d7d0dc}.field-text:not(:has(>.field-text-input:disabled)):has(>.field-text-input:invalid):hover:not(:has(>.field-text-input:disabled)):not(:focus-within).field-text-filled::after{border-color:#410e0b}.field-text:not(:has(>.field-text-input:disabled)):has(>.field-text-input:invalid):hover:not(:has(>.field-text-input:disabled)):not(:focus-within) .field-text-icon-trailing,.field-text:not(:has(>.field-text-input:disabled)):has(>.field-text-input:invalid):hover:not(:has(>.field-text-input:disabled)):not(:focus-within) .field-text-label{color:#410e0b}.ml-theme-dark .field-text.field-text-filled,body[data-ml-theme=dark] .field-text.field-text-filled{background:#49454f}.ml-theme-dark .field-text.field-text-outlined,body[data-ml-theme=dark] .field-text.field-text-outlined{border-color:#938f99}.ml-theme-dark .field-text.field-text-filled::after,body[data-ml-theme=dark] .field-text.field-text-filled::after{border-color:#cac4d0}.ml-theme-dark .field-text .field-text-input,body[data-ml-theme=dark] .field-text .field-text-input{color:#e6e1e5;caret-color:#d0bcff}.ml-theme-dark .field-text .field-text-input::placeholder,body[data-ml-theme=dark] .field-text .field-text-input::placeholder{color:#cac4d0}.ml-theme-dark .field-text .field-text-icon-leading,.ml-theme-dark .field-text .field-text-icon-trailing,.ml-theme-dark .field-text .field-text-label,body[data-ml-theme=dark] .field-text .field-text-icon-leading,body[data-ml-theme=dark] .field-text .field-text-icon-trailing,body[data-ml-theme=dark] .field-text .field-text-label{color:#cac4d0}.ml-theme-dark .field-text:has(>.field-text-input:disabled).field-text-filled,body[data-ml-theme=dark] .field-text:has(>.field-text-input:disabled).field-text-filled{background:rgba(230,225,229,.04)}.ml-theme-dark .field-text:has(>.field-text-input:disabled).field-text-filled::after,body[data-ml-theme=dark] .field-text:has(>.field-text-input:disabled).field-text-filled::after{border-color:rgba(230,225,229,.38)}.ml-theme-dark .field-text:has(>.field-text-input:disabled) .field-text-icon-leading,.ml-theme-dark .field-text:has(>.field-text-input:disabled) .field-text-icon-trailing,.ml-theme-dark .field-text:has(>.field-text-input:disabled) .field-text-input,.ml-theme-dark .field-text:has(>.field-text-input:disabled) .field-text-label,body[data-ml-theme=dark] .field-text:has(>.field-text-input:disabled) .field-text-icon-leading,body[data-ml-theme=dark] .field-text:has(>.field-text-input:disabled) .field-text-icon-trailing,body[data-ml-theme=dark] .field-text:has(>.field-text-input:disabled) .field-text-input,body[data-ml-theme=dark] .field-text:has(>.field-text-input:disabled) .field-text-label{color:rgba(230,225,229,.38)}.ml-theme-dark .field-text:focus-within:not(:has(>.field-text-input:disabled)).field-text-filled::after,body[data-ml-theme=dark] .field-text:focus-within:not(:has(>.field-text-input:disabled)).field-text-filled::after{border-color:#d0bcff}.ml-theme-dark .field-text:focus-within:not(:has(>.field-text-input:disabled)) .field-text-label,body[data-ml-theme=dark] .field-text:focus-within:not(:has(>.field-text-input:disabled)) .field-text-label{color:#d0bcff}.ml-theme-dark .field-text:hover:not(:has(>.field-text-input:disabled)):not(:focus-within).field-text-filled,body[data-ml-theme=dark] .field-text:hover:not(:has(>.field-text-input:disabled)):not(:focus-within).field-text-filled{background:#56515b}.ml-theme-dark .field-text:not(:has(>.field-text-input:disabled)):has(>.field-text-input:invalid).field-text-filled::after,body[data-ml-theme=dark] .field-text:not(:has(>.field-text-input:disabled)):has(>.field-text-input:invalid).field-text-filled::after{border-color:#f2b8b5}.ml-theme-dark .field-text:not(:has(>.field-text-input:disabled)):has(>.field-text-input:invalid) .field-text-icon-trailing,.ml-theme-dark .field-text:not(:has(>.field-text-input:disabled)):has(>.field-text-input:invalid) .field-text-label,body[data-ml-theme=dark] .field-text:not(:has(>.field-text-input:disabled)):has(>.field-text-input:invalid) .field-text-icon-trailing,body[data-ml-theme=dark] .field-text:not(:has(>.field-text-input:disabled)):has(>.field-text-input:invalid) .field-text-label{color:#f2b8b5}.ml-theme-dark .field-text:not(:has(>.field-text-input:disabled)):has(>.field-text-input:invalid) .field-text-input,body[data-ml-theme=dark] .field-text:not(:has(>.field-text-input:disabled)):has(>.field-text-input:invalid) .field-text-input{caret-color:#f2b8b5}.ml-theme-dark .field-text:not(:has(>.field-text-input:disabled)):has(>.field-text-input:invalid):hover:not(:has(>.field-text-input:disabled)):not(:focus-within).field-text-filled,body[data-ml-theme=dark] .field-text:not(:has(>.field-text-input:disabled)):has(>.field-text-input:invalid):hover:not(:has(>.field-text-input:disabled)):not(:focus-within).field-text-filled{background:#56515b}.ml-theme-dark .field-text:not(:has(>.field-text-input:disabled)):has(>.field-text-input:invalid):hover:not(:has(>.field-text-input:disabled)):not(:focus-within).field-text-filled::after,body[data-ml-theme=dark] .field-text:not(:has(>.field-text-input:disabled)):has(>.field-text-input:invalid):hover:not(:has(>.field-text-input:disabled)):not(:focus-within).field-text-filled::after{border-color:#f2b8b5}.ml-theme-dark .field-text:not(:has(>.field-text-input:disabled)):has(>.field-text-input:invalid):hover:not(:has(>.field-text-input:disabled)):not(:focus-within) .field-text-icon-trailing,.ml-theme-dark .field-text:not(:has(>.field-text-input:disabled)):has(>.field-text-input:invalid):hover:not(:has(>.field-text-input:disabled)):not(:focus-within) .field-text-label,body[data-ml-theme=dark] .field-text:not(:has(>.field-text-input:disabled)):has(>.field-text-input:invalid):hover:not(:has(>.field-text-input:disabled)):not(:focus-within) .field-text-icon-trailing,body[data-ml-theme=dark] .field-text:not(:has(>.field-text-input:disabled)):has(>.field-text-input:invalid):hover:not(:has(>.field-text-input:disabled)):not(:focus-within) .field-text-label{color:#f2b8b5}.field-text-support{margin:.25rem 1rem 0;color:#49454f;font-family:"Roboto Flex",roboto,system-ui,-apple-system,blinkmacsystemfont,"Segoe UI",helvetica,arial,ubuntu,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji";line-height:1rem;font-size:.75rem;font-weight:400;letter-spacing:.025rem}.field-text-support[aria-disabled=true]{color:rgba(28,27,31,.38)}.field-text-support[aria-invalid=true]{color:#b3261e}.ml-theme-dark .field-text-support,body[data-ml-theme=dark] .field-text-support{color:#cac4d0}.ml-theme-dark .field-text-support[aria-disabled=true],body[data-ml-theme=dark] .field-text-support[aria-disabled=true]{color:rgba(230,225,229,.38)}.ml-theme-dark .field-text-support[aria-invalid=true],body[data-ml-theme=dark] .field-text-support[aria-invalid=true]{color:#f2b8b5}.typography-headline-large,.typography-headline-medium,.typography-headline-small{font-family:var(--ml-font-sans-serif);font-size:2rem;line-height:2.5rem;letter-spacing:0;font-weight:400}.typography-headline-medium,.typography-headline-small{font-size:1.75rem;line-height:2.25rem}.typography-headline-small{font-size:1.5rem;line-height:2rem}.typography-body-large,.typography-title-small{font-family:var(--ml-font-sans-serif);font-size:.875rem;line-height:1.25rem;letter-spacing:.00625rem;font-weight:500}.typography-body-large{font-size:1rem;line-height:1.5rem;letter-spacing:.03125rem;font-weight:400}.m-0{margin:0!important}.m-1{margin:.25rem!important}.m-2{margin:.5rem!important}.m-3{margin:1rem!important}.m-4{margin:1.5rem!important}.m-5{margin:3rem!important}.m-auto{margin:auto!important}.mx-0{margin-right:0!important;margin-left:0!important}.mx-1{margin-right:.25rem!important;margin-left:.25rem!important}.mx-2{margin-right:.5rem!important;margin-left:.5rem!important}.mx-3{margin-right:1rem!important;margin-left:1rem!important}.mx-4{margin-right:1.5rem!important;margin-left:1.5rem!important}.mx-5{margin-right:3rem!important;margin-left:3rem!important}.mx-auto{margin-right:auto!important;margin-left:auto!important}.my-0{margin-top:0!important;margin-bottom:0!important}.my-1{margin-top:.25rem!important;margin-bottom:.25rem!important}.my-2{margin-top:.5rem!important;margin-bottom:.5rem!important}.my-3{margin-top:1rem!important;margin-bottom:1rem!important}.my-4{margin-top:1.5rem!important;margin-bottom:1.5rem!important}.my-5{margin-top:3rem!important;margin-bottom:3rem!important}.my-auto{margin-top:auto!important;margin-bottom:auto!important}.mt-0{margin-top:0!important}.mt-1{margin-top:.25rem!important}.mt-2{margin-top:.5rem!important}.mt-3{margin-top:1rem!important}.mt-4{margin-top:1.5rem!important}.mt-5{margin-top:3rem!important}.mt-auto{margin-top:auto!important}.me-0{margin-right:0!important}.me-1{margin-right:.25rem!important}.me-2{margin-right:.5rem!important}.me-3{margin-right:1rem!important}.me-4{margin-right:1.5rem!important}.me-5{margin-right:3rem!important}.me-auto{margin-right:auto!important}.mb-0{margin-bottom:0!important}.mb-1{margin-bottom:.25rem!important}.mb-2{margin-bottom:.5rem!important}.mb-3{margin-bottom:1rem!important}.mb-4{margin-bottom:1.5rem!important}.mb-5{margin-bottom:3rem!important}.mb-auto{margin-bottom:auto!important}.ms-0{margin-left:0!important}.ms-1{margin-left:.25rem!important}.ms-2{margin-left:.5rem!important}.ms-3{margin-left:1rem!important}.ms-4{margin-left:1.5rem!important}.ms-5{margin-left:3rem!important}.ms-auto{margin-left:auto!important}.p-0{padding:0!important}.p-1{padding:.25rem!important}.p-2{padding:.5rem!important}.p-3{padding:1rem!important}.p-4{padding:1.5rem!important}.p-5{padding:3rem!important}.px-0{padding-right:0!important;padding-left:0!important}.px-1{padding-right:.25rem!important;padding-left:.25rem!important}.px-2{padding-right:.5rem!important;padding-left:.5rem!important}.px-3{padding-right:1rem!important;padding-left:1rem!important}.px-4{padding-right:1.5rem!important;padding-left:1.5rem!important}.px-5{padding-right:3rem!important;padding-left:3rem!important}.py-0{padding-top:0!important;padding-bottom:0!important}.py-1{padding-top:.25rem!important;padding-bottom:.25rem!important}.py-2{padding-top:.5rem!important;padding-bottom:.5rem!important}.py-3{padding-top:1rem!important;padding-bottom:1rem!important}.py-4{padding-top:1.5rem!important;padding-bottom:1.5rem!important}.py-5{padding-top:3rem!important;padding-bottom:3rem!important}.pt-0{padding-top:0!important}.pt-1{padding-top:.25rem!important}.pt-2{padding-top:.5rem!important}.pt-3{padding-top:1rem!important}.pt-4{padding-top:1.5rem!important}.pt-5{padding-top:3rem!important}.pe-0{padding-right:0!important}.pe-1{padding-right:.25rem!important}.pe-2{padding-right:.5rem!important}.pe-3{padding-right:1rem!important}.pe-4{padding-right:1.5rem!important}.pe-5{padding-right:3rem!important}.pb-0{padding-bottom:0!important}.pb-1{padding-bottom:.25rem!important}.pb-2{padding-bottom:.5rem!important}.pb-3{padding-bottom:1rem!important}.pb-4{padding-bottom:1.5rem!important}.pb-5{padding-bottom:3rem!important}.ps-0{padding-left:0!important}.ps-1{padding-left:.25rem!important}.ps-2{padding-left:.5rem!important}.ps-3{padding-left:1rem!important}.ps-4{padding-left:1.5rem!important}.ps-5{padding-left:3rem!important}.gap-0{gap:0!important}.gap-1{gap:.25rem!important}.gap-2{gap:.5rem!important}.gap-3{gap:1rem!important}.gap-4{gap:1.5rem!important}.gap-5{gap:3rem!important}@media (min-width:576px){.m-sm-0{margin:0!important}.m-sm-1{margin:.25rem!important}.m-sm-2{margin:.5rem!important}.m-sm-3{margin:1rem!important}.m-sm-4{margin:1.5rem!important}.m-sm-5{margin:3rem!important}.m-sm-auto{margin:auto!important}.mx-sm-0{margin-right:0!important;margin-left:0!important}.mx-sm-1{margin-right:.25rem!important;margin-left:.25rem!important}.mx-sm-2{margin-right:.5rem!important;margin-left:.5rem!important}.mx-sm-3{margin-right:1rem!important;margin-left:1rem!important}.mx-sm-4{margin-right:1.5rem!important;margin-left:1.5rem!important}.mx-sm-5{margin-right:3rem!important;margin-left:3rem!important}.mx-sm-auto{margin-right:auto!important;margin-left:auto!important}.my-sm-0{margin-top:0!important;margin-bottom:0!important}.my-sm-1{margin-top:.25rem!important;margin-bottom:.25rem!important}.my-sm-2{margin-top:.5rem!important;margin-bottom:.5rem!important}.my-sm-3{margin-top:1rem!important;margin-bottom:1rem!important}.my-sm-4{margin-top:1.5rem!important;margin-bottom:1.5rem!important}.my-sm-5{margin-top:3rem!important;margin-bottom:3rem!important}.my-sm-auto{margin-top:auto!important;margin-bottom:auto!important}.mt-sm-0{margin-top:0!important}.mt-sm-1{margin-top:.25rem!important}.mt-sm-2{margin-top:.5rem!important}.mt-sm-3{margin-top:1rem!important}.mt-sm-4{margin-top:1.5rem!important}.mt-sm-5{margin-top:3rem!important}.mt-sm-auto{margin-top:auto!important}.me-sm-0{margin-right:0!important}.me-sm-1{margin-right:.25rem!important}.me-sm-2{margin-right:.5rem!important}.me-sm-3{margin-right:1rem!important}.me-sm-4{margin-right:1.5rem!important}.me-sm-5{margin-right:3rem!important}.me-sm-auto{margin-right:auto!important}.mb-sm-0{margin-bottom:0!important}.mb-sm-1{margin-bottom:.25rem!important}.mb-sm-2{margin-bottom:.5rem!important}.mb-sm-3{margin-bottom:1rem!important}.mb-sm-4{margin-bottom:1.5rem!important}.mb-sm-5{margin-bottom:3rem!important}.mb-sm-auto{margin-bottom:auto!important}.ms-sm-0{margin-left:0!important}.ms-sm-1{margin-left:.25rem!important}.ms-sm-2{margin-left:.5rem!important}.ms-sm-3{margin-left:1rem!important}.ms-sm-4{margin-left:1.5rem!important}.ms-sm-5{margin-left:3rem!important}.ms-sm-auto{margin-left:auto!important}.p-sm-0{padding:0!important}.p-sm-1{padding:.25rem!important}.p-sm-2{padding:.5rem!important}.p-sm-3{padding:1rem!important}.p-sm-4{padding:1.5rem!important}.p-sm-5{padding:3rem!important}.px-sm-0{padding-right:0!important;padding-left:0!important}.px-sm-1{padding-right:.25rem!important;padding-left:.25rem!important}.px-sm-2{padding-right:.5rem!important;padding-left:.5rem!important}.px-sm-3{padding-right:1rem!important;padding-left:1rem!important}.px-sm-4{padding-right:1.5rem!important;padding-left:1.5rem!important}.px-sm-5{padding-right:3rem!important;padding-left:3rem!important}.py-sm-0{padding-top:0!important;padding-bottom:0!important}.py-sm-1{padding-top:.25rem!important;padding-bottom:.25rem!important}.py-sm-2{padding-top:.5rem!important;padding-bottom:.5rem!important}.py-sm-3{padding-top:1rem!important;padding-bottom:1rem!important}.py-sm-4{padding-top:1.5rem!important;padding-bottom:1.5rem!important}.py-sm-5{padding-top:3rem!important;padding-bottom:3rem!important}.pt-sm-0{padding-top:0!important}.pt-sm-1{padding-top:.25rem!important}.pt-sm-2{padding-top:.5rem!important}.pt-sm-3{padding-top:1rem!important}.pt-sm-4{padding-top:1.5rem!important}.pt-sm-5{padding-top:3rem!important}.pe-sm-0{padding-right:0!important}.pe-sm-1{padding-right:.25rem!important}.pe-sm-2{padding-right:.5rem!important}.pe-sm-3{padding-right:1rem!important}.pe-sm-4{padding-right:1.5rem!important}.pe-sm-5{padding-right:3rem!important}.pb-sm-0{padding-bottom:0!important}.pb-sm-1{padding-bottom:.25rem!important}.pb-sm-2{padding-bottom:.5rem!important}.pb-sm-3{padding-bottom:1rem!important}.pb-sm-4{padding-bottom:1.5rem!important}.pb-sm-5{padding-bottom:3rem!important}.ps-sm-0{padding-left:0!important}.ps-sm-1{padding-left:.25rem!important}.ps-sm-2{padding-left:.5rem!important}.ps-sm-3{padding-left:1rem!important}.ps-sm-4{padding-left:1.5rem!important}.ps-sm-5{padding-left:3rem!important}.gap-sm-0{gap:0!important}.gap-sm-1{gap:.25rem!important}.gap-sm-2{gap:.5rem!important}.gap-sm-3{gap:1rem!important}.gap-sm-4{gap:1.5rem!important}.gap-sm-5{gap:3rem!important}}@media (min-width:768px){.m-md-0{margin:0!important}.m-md-1{margin:.25rem!important}.m-md-2{margin:.5rem!important}.m-md-3{margin:1rem!important}.m-md-4{margin:1.5rem!important}.m-md-5{margin:3rem!important}.m-md-auto{margin:auto!important}.mx-md-0{margin-right:0!important;margin-left:0!important}.mx-md-1{margin-right:.25rem!important;margin-left:.25rem!important}.mx-md-2{margin-right:.5rem!important;margin-left:.5rem!important}.mx-md-3{margin-right:1rem!important;margin-left:1rem!important}.mx-md-4{margin-right:1.5rem!important;margin-left:1.5rem!important}.mx-md-5{margin-right:3rem!important;margin-left:3rem!important}.mx-md-auto{margin-right:auto!important;margin-left:auto!important}.my-md-0{margin-top:0!important;margin-bottom:0!important}.my-md-1{margin-top:.25rem!important;margin-bottom:.25rem!important}.my-md-2{margin-top:.5rem!important;margin-bottom:.5rem!important}.my-md-3{margin-top:1rem!important;margin-bottom:1rem!important}.my-md-4{margin-top:1.5rem!important;margin-bottom:1.5rem!important}.my-md-5{margin-top:3rem!important;margin-bottom:3rem!important}.my-md-auto{margin-top:auto!important;margin-bottom:auto!important}.mt-md-0{margin-top:0!important}.mt-md-1{margin-top:.25rem!important}.mt-md-2{margin-top:.5rem!important}.mt-md-3{margin-top:1rem!important}.mt-md-4{margin-top:1.5rem!important}.mt-md-5{margin-top:3rem!important}.mt-md-auto{margin-top:auto!important}.me-md-0{margin-right:0!important}.me-md-1{margin-right:.25rem!important}.me-md-2{margin-right:.5rem!important}.me-md-3{margin-right:1rem!important}.me-md-4{margin-right:1.5rem!important}.me-md-5{margin-right:3rem!important}.me-md-auto{margin-right:auto!important}.mb-md-0{margin-bottom:0!important}.mb-md-1{margin-bottom:.25rem!important}.mb-md-2{margin-bottom:.5rem!important}.mb-md-3{margin-bottom:1rem!important}.mb-md-4{margin-bottom:1.5rem!important}.mb-md-5{margin-bottom:3rem!important}.mb-md-auto{margin-bottom:auto!important}.ms-md-0{margin-left:0!important}.ms-md-1{margin-left:.25rem!important}.ms-md-2{margin-left:.5rem!important}.ms-md-3{margin-left:1rem!important}.ms-md-4{margin-left:1.5rem!important}.ms-md-5{margin-left:3rem!important}.ms-md-auto{margin-left:auto!important}.p-md-0{padding:0!important}.p-md-1{padding:.25rem!important}.p-md-2{padding:.5rem!important}.p-md-3{padding:1rem!important}.p-md-4{padding:1.5rem!important}.p-md-5{padding:3rem!important}.px-md-0{padding-right:0!important;padding-left:0!important}.px-md-1{padding-right:.25rem!important;padding-left:.25rem!important}.px-md-2{padding-right:.5rem!important;padding-left:.5rem!important}.px-md-3{padding-right:1rem!important;padding-left:1rem!important}.px-md-4{padding-right:1.5rem!important;padding-left:1.5rem!important}.px-md-5{padding-right:3rem!important;padding-left:3rem!important}.py-md-0{padding-top:0!important;padding-bottom:0!important}.py-md-1{padding-top:.25rem!important;padding-bottom:.25rem!important}.py-md-2{padding-top:.5rem!important;padding-bottom:.5rem!important}.py-md-3{padding-top:1rem!important;padding-bottom:1rem!important}.py-md-4{padding-top:1.5rem!important;padding-bottom:1.5rem!important}.py-md-5{padding-top:3rem!important;padding-bottom:3rem!important}.pt-md-0{padding-top:0!important}.pt-md-1{padding-top:.25rem!important}.pt-md-2{padding-top:.5rem!important}.pt-md-3{padding-top:1rem!important}.pt-md-4{padding-top:1.5rem!important}.pt-md-5{padding-top:3rem!important}.pe-md-0{padding-right:0!important}.pe-md-1{padding-right:.25rem!important}.pe-md-2{padding-right:.5rem!important}.pe-md-3{padding-right:1rem!important}.pe-md-4{padding-right:1.5rem!important}.pe-md-5{padding-right:3rem!important}.pb-md-0{padding-bottom:0!important}.pb-md-1{padding-bottom:.25rem!important}.pb-md-2{padding-bottom:.5rem!important}.pb-md-3{padding-bottom:1rem!important}.pb-md-4{padding-bottom:1.5rem!important}.pb-md-5{padding-bottom:3rem!important}.ps-md-0{padding-left:0!important}.ps-md-1{padding-left:.25rem!important}.ps-md-2{padding-left:.5rem!important}.ps-md-3{padding-left:1rem!important}.ps-md-4{padding-left:1.5rem!important}.ps-md-5{padding-left:3rem!important}.gap-md-0{gap:0!important}.gap-md-1{gap:.25rem!important}.gap-md-2{gap:.5rem!important}.gap-md-3{gap:1rem!important}.gap-md-4{gap:1.5rem!important}.gap-md-5{gap:3rem!important}}@media (min-width:992px){.m-lg-0{margin:0!important}.m-lg-1{margin:.25rem!important}.m-lg-2{margin:.5rem!important}.m-lg-3{margin:1rem!important}.m-lg-4{margin:1.5rem!important}.m-lg-5{margin:3rem!important}.m-lg-auto{margin:auto!important}.mx-lg-0{margin-right:0!important;margin-left:0!important}.mx-lg-1{margin-right:.25rem!important;margin-left:.25rem!important}.mx-lg-2{margin-right:.5rem!important;margin-left:.5rem!important}.mx-lg-3{margin-right:1rem!important;margin-left:1rem!important}.mx-lg-4{margin-right:1.5rem!important;margin-left:1.5rem!important}.mx-lg-5{margin-right:3rem!important;margin-left:3rem!important}.mx-lg-auto{margin-right:auto!important;margin-left:auto!important}.my-lg-0{margin-top:0!important;margin-bottom:0!important}.my-lg-1{margin-top:.25rem!important;margin-bottom:.25rem!important}.my-lg-2{margin-top:.5rem!important;margin-bottom:.5rem!important}.my-lg-3{margin-top:1rem!important;margin-bottom:1rem!important}.my-lg-4{margin-top:1.5rem!important;margin-bottom:1.5rem!important}.my-lg-5{margin-top:3rem!important;margin-bottom:3rem!important}.my-lg-auto{margin-top:auto!important;margin-bottom:auto!important}.mt-lg-0{margin-top:0!important}.mt-lg-1{margin-top:.25rem!important}.mt-lg-2{margin-top:.5rem!important}.mt-lg-3{margin-top:1rem!important}.mt-lg-4{margin-top:1.5rem!important}.mt-lg-5{margin-top:3rem!important}.mt-lg-auto{margin-top:auto!important}.me-lg-0{margin-right:0!important}.me-lg-1{margin-right:.25rem!important}.me-lg-2{margin-right:.5rem!important}.me-lg-3{margin-right:1rem!important}.me-lg-4{margin-right:1.5rem!important}.me-lg-5{margin-right:3rem!important}.me-lg-auto{margin-right:auto!important}.mb-lg-0{margin-bottom:0!important}.mb-lg-1{margin-bottom:.25rem!important}.mb-lg-2{margin-bottom:.5rem!important}.mb-lg-3{margin-bottom:1rem!important}.mb-lg-4{margin-bottom:1.5rem!important}.mb-lg-5{margin-bottom:3rem!important}.mb-lg-auto{margin-bottom:auto!important}.ms-lg-0{margin-left:0!important}.ms-lg-1{margin-left:.25rem!important}.ms-lg-2{margin-left:.5rem!important}.ms-lg-3{margin-left:1rem!important}.ms-lg-4{margin-left:1.5rem!important}.ms-lg-5{margin-left:3rem!important}.ms-lg-auto{margin-left:auto!important}.p-lg-0{padding:0!important}.p-lg-1{padding:.25rem!important}.p-lg-2{padding:.5rem!important}.p-lg-3{padding:1rem!important}.p-lg-4{padding:1.5rem!important}.p-lg-5{padding:3rem!important}.px-lg-0{padding-right:0!important;padding-left:0!important}.px-lg-1{padding-right:.25rem!important;padding-left:.25rem!important}.px-lg-2{padding-right:.5rem!important;padding-left:.5rem!important}.px-lg-3{padding-right:1rem!important;padding-left:1rem!important}.px-lg-4{padding-right:1.5rem!important;padding-left:1.5rem!important}.px-lg-5{padding-right:3rem!important;padding-left:3rem!important}.py-lg-0{padding-top:0!important;padding-bottom:0!important}.py-lg-1{padding-top:.25rem!important;padding-bottom:.25rem!important}.py-lg-2{padding-top:.5rem!important;padding-bottom:.5rem!important}.py-lg-3{padding-top:1rem!important;padding-bottom:1rem!important}.py-lg-4{padding-top:1.5rem!important;padding-bottom:1.5rem!important}.py-lg-5{padding-top:3rem!important;padding-bottom:3rem!important}.pt-lg-0{padding-top:0!important}.pt-lg-1{padding-top:.25rem!important}.pt-lg-2{padding-top:.5rem!important}.pt-lg-3{padding-top:1rem!important}.pt-lg-4{padding-top:1.5rem!important}.pt-lg-5{padding-top:3rem!important}.pe-lg-0{padding-right:0!important}.pe-lg-1{padding-right:.25rem!important}.pe-lg-2{padding-right:.5rem!important}.pe-lg-3{padding-right:1rem!important}.pe-lg-4{padding-right:1.5rem!important}.pe-lg-5{padding-right:3rem!important}.pb-lg-0{padding-bottom:0!important}.pb-lg-1{padding-bottom:.25rem!important}.pb-lg-2{padding-bottom:.5rem!important}.pb-lg-3{padding-bottom:1rem!important}.pb-lg-4{padding-bottom:1.5rem!important}.pb-lg-5{padding-bottom:3rem!important}.ps-lg-0{padding-left:0!important}.ps-lg-1{padding-left:.25rem!important}.ps-lg-2{padding-left:.5rem!important}.ps-lg-3{padding-left:1rem!important}.ps-lg-4{padding-left:1.5rem!important}.ps-lg-5{padding-left:3rem!important}.gap-lg-0{gap:0!important}.gap-lg-1{gap:.25rem!important}.gap-lg-2{gap:.5rem!important}.gap-lg-3{gap:1rem!important}.gap-lg-4{gap:1.5rem!important}.gap-lg-5{gap:3rem!important}}@media (min-width:1200px){.m-xl-0{margin:0!important}.m-xl-1{margin:.25rem!important}.m-xl-2{margin:.5rem!important}.m-xl-3{margin:1rem!important}.m-xl-4{margin:1.5rem!important}.m-xl-5{margin:3rem!important}.m-xl-auto{margin:auto!important}.mx-xl-0{margin-right:0!important;margin-left:0!important}.mx-xl-1{margin-right:.25rem!important;margin-left:.25rem!important}.mx-xl-2{margin-right:.5rem!important;margin-left:.5rem!important}.mx-xl-3{margin-right:1rem!important;margin-left:1rem!important}.mx-xl-4{margin-right:1.5rem!important;margin-left:1.5rem!important}.mx-xl-5{margin-right:3rem!important;margin-left:3rem!important}.mx-xl-auto{margin-right:auto!important;margin-left:auto!important}.my-xl-0{margin-top:0!important;margin-bottom:0!important}.my-xl-1{margin-top:.25rem!important;margin-bottom:.25rem!important}.my-xl-2{margin-top:.5rem!important;margin-bottom:.5rem!important}.my-xl-3{margin-top:1rem!important;margin-bottom:1rem!important}.my-xl-4{margin-top:1.5rem!important;margin-bottom:1.5rem!important}.my-xl-5{margin-top:3rem!important;margin-bottom:3rem!important}.my-xl-auto{margin-top:auto!important;margin-bottom:auto!important}.mt-xl-0{margin-top:0!important}.mt-xl-1{margin-top:.25rem!important}.mt-xl-2{margin-top:.5rem!important}.mt-xl-3{margin-top:1rem!important}.mt-xl-4{margin-top:1.5rem!important}.mt-xl-5{margin-top:3rem!important}.mt-xl-auto{margin-top:auto!important}.me-xl-0{margin-right:0!important}.me-xl-1{margin-right:.25rem!important}.me-xl-2{margin-right:.5rem!important}.me-xl-3{margin-right:1rem!important}.me-xl-4{margin-right:1.5rem!important}.me-xl-5{margin-right:3rem!important}.me-xl-auto{margin-right:auto!important}.mb-xl-0{margin-bottom:0!important}.mb-xl-1{margin-bottom:.25rem!important}.mb-xl-2{margin-bottom:.5rem!important}.mb-xl-3{margin-bottom:1rem!important}.mb-xl-4{margin-bottom:1.5rem!important}.mb-xl-5{margin-bottom:3rem!important}.mb-xl-auto{margin-bottom:auto!important}.ms-xl-0{margin-left:0!important}.ms-xl-1{margin-left:.25rem!important}.ms-xl-2{margin-left:.5rem!important}.ms-xl-3{margin-left:1rem!important}.ms-xl-4{margin-left:1.5rem!important}.ms-xl-5{margin-left:3rem!important}.ms-xl-auto{margin-left:auto!important}.p-xl-0{padding:0!important}.p-xl-1{padding:.25rem!important}.p-xl-2{padding:.5rem!important}.p-xl-3{padding:1rem!important}.p-xl-4{padding:1.5rem!important}.p-xl-5{padding:3rem!important}.px-xl-0{padding-right:0!important;padding-left:0!important}.px-xl-1{padding-right:.25rem!important;padding-left:.25rem!important}.px-xl-2{padding-right:.5rem!important;padding-left:.5rem!important}.px-xl-3{padding-right:1rem!important;padding-left:1rem!important}.px-xl-4{padding-right:1.5rem!important;padding-left:1.5rem!important}.px-xl-5{padding-right:3rem!important;padding-left:3rem!important}.py-xl-0{padding-top:0!important;padding-bottom:0!important}.py-xl-1{padding-top:.25rem!important;padding-bottom:.25rem!important}.py-xl-2{padding-top:.5rem!important;padding-bottom:.5rem!important}.py-xl-3{padding-top:1rem!important;padding-bottom:1rem!important}.py-xl-4{padding-top:1.5rem!important;padding-bottom:1.5rem!important}.py-xl-5{padding-top:3rem!important;padding-bottom:3rem!important}.pt-xl-0{padding-top:0!important}.pt-xl-1{padding-top:.25rem!important}.pt-xl-2{padding-top:.5rem!important}.pt-xl-3{padding-top:1rem!important}.pt-xl-4{padding-top:1.5rem!important}.pt-xl-5{padding-top:3rem!important}.pe-xl-0{padding-right:0!important}.pe-xl-1{padding-right:.25rem!important}.pe-xl-2{padding-right:.5rem!important}.pe-xl-3{padding-right:1rem!important}.pe-xl-4{padding-right:1.5rem!important}.pe-xl-5{padding-right:3rem!important}.pb-xl-0{padding-bottom:0!important}.pb-xl-1{padding-bottom:.25rem!important}.pb-xl-2{padding-bottom:.5rem!important}.pb-xl-3{padding-bottom:1rem!important}.pb-xl-4{padding-bottom:1.5rem!important}.pb-xl-5{padding-bottom:3rem!important}.ps-xl-0{padding-left:0!important}.ps-xl-1{padding-left:.25rem!important}.ps-xl-2{padding-left:.5rem!important}.ps-xl-3{padding-left:1rem!important}.ps-xl-4{padding-left:1.5rem!important}.ps-xl-5{padding-left:3rem!important}.gap-xl-0{gap:0!important}.gap-xl-1{gap:.25rem!important}.gap-xl-2{gap:.5rem!important}.gap-xl-3{gap:1rem!important}.gap-xl-4{gap:1.5rem!important}.gap-xl-5{gap:3rem!important}}@media (min-width:1400px){.m-xxl-0{margin:0!important}.m-xxl-1{margin:.25rem!important}.m-xxl-2{margin:.5rem!important}.m-xxl-3{margin:1rem!important}.m-xxl-4{margin:1.5rem!important}.m-xxl-5{margin:3rem!important}.m-xxl-auto{margin:auto!important}.mx-xxl-0{margin-right:0!important;margin-left:0!important}.mx-xxl-1{margin-right:.25rem!important;margin-left:.25rem!important}.mx-xxl-2{margin-right:.5rem!important;margin-left:.5rem!important}.mx-xxl-3{margin-right:1rem!important;margin-left:1rem!important}.mx-xxl-4{margin-right:1.5rem!important;margin-left:1.5rem!important}.mx-xxl-5{margin-right:3rem!important;margin-left:3rem!important}.mx-xxl-auto{margin-right:auto!important;margin-left:auto!important}.my-xxl-0{margin-top:0!important;margin-bottom:0!important}.my-xxl-1{margin-top:.25rem!important;margin-bottom:.25rem!important}.my-xxl-2{margin-top:.5rem!important;margin-bottom:.5rem!important}.my-xxl-3{margin-top:1rem!important;margin-bottom:1rem!important}.my-xxl-4{margin-top:1.5rem!important;margin-bottom:1.5rem!important}.my-xxl-5{margin-top:3rem!important;margin-bottom:3rem!important}.my-xxl-auto{margin-top:auto!important;margin-bottom:auto!important}.mt-xxl-0{margin-top:0!important}.mt-xxl-1{margin-top:.25rem!important}.mt-xxl-2{margin-top:.5rem!important}.mt-xxl-3{margin-top:1rem!important}.mt-xxl-4{margin-top:1.5rem!important}.mt-xxl-5{margin-top:3rem!important}.mt-xxl-auto{margin-top:auto!important}.me-xxl-0{margin-right:0!important}.me-xxl-1{margin-right:.25rem!important}.me-xxl-2{margin-right:.5rem!important}.me-xxl-3{margin-right:1rem!important}.me-xxl-4{margin-right:1.5rem!important}.me-xxl-5{margin-right:3rem!important}.me-xxl-auto{margin-right:auto!important}.mb-xxl-0{margin-bottom:0!important}.mb-xxl-1{margin-bottom:.25rem!important}.mb-xxl-2{margin-bottom:.5rem!important}.mb-xxl-3{margin-bottom:1rem!important}.mb-xxl-4{margin-bottom:1.5rem!important}.mb-xxl-5{margin-bottom:3rem!important}.mb-xxl-auto{margin-bottom:auto!important}.ms-xxl-0{margin-left:0!important}.ms-xxl-1{margin-left:.25rem!important}.ms-xxl-2{margin-left:.5rem!important}.ms-xxl-3{margin-left:1rem!important}.ms-xxl-4{margin-left:1.5rem!important}.ms-xxl-5{margin-left:3rem!important}.ms-xxl-auto{margin-left:auto!important}.p-xxl-0{padding:0!important}.p-xxl-1{padding:.25rem!important}.p-xxl-2{padding:.5rem!important}.p-xxl-3{padding:1rem!important}.p-xxl-4{padding:1.5rem!important}.p-xxl-5{padding:3rem!important}.px-xxl-0{padding-right:0!important;padding-left:0!important}.px-xxl-1{padding-right:.25rem!important;padding-left:.25rem!important}.px-xxl-2{padding-right:.5rem!important;padding-left:.5rem!important}.px-xxl-3{padding-right:1rem!important;padding-left:1rem!important}.px-xxl-4{padding-right:1.5rem!important;padding-left:1.5rem!important}.px-xxl-5{padding-right:3rem!important;padding-left:3rem!important}.py-xxl-0{padding-top:0!important;padding-bottom:0!important}.py-xxl-1{padding-top:.25rem!important;padding-bottom:.25rem!important}.py-xxl-2{padding-top:.5rem!important;padding-bottom:.5rem!important}.py-xxl-3{padding-top:1rem!important;padding-bottom:1rem!important}.py-xxl-4{padding-top:1.5rem!important;padding-bottom:1.5rem!important}.py-xxl-5{padding-top:3rem!important;padding-bottom:3rem!important}.pt-xxl-0{padding-top:0!important}.pt-xxl-1{padding-top:.25rem!important}.pt-xxl-2{padding-top:.5rem!important}.pt-xxl-3{padding-top:1rem!important}.pt-xxl-4{padding-top:1.5rem!important}.pt-xxl-5{padding-top:3rem!important}.pe-xxl-0{padding-right:0!important}.pe-xxl-1{padding-right:.25rem!important}.pe-xxl-2{padding-right:.5rem!important}.pe-xxl-3{padding-right:1rem!important}.pe-xxl-4{padding-right:1.5rem!important}.pe-xxl-5{padding-right:3rem!important}.pb-xxl-0{padding-bottom:0!important}.pb-xxl-1{padding-bottom:.25rem!important}.pb-xxl-2{padding-bottom:.5rem!important}.pb-xxl-3{padding-bottom:1rem!important}.pb-xxl-4{padding-bottom:1.5rem!important}.pb-xxl-5{padding-bottom:3rem!important}.ps-xxl-0{padding-left:0!important}.ps-xxl-1{padding-left:.25rem!important}.ps-xxl-2{padding-left:.5rem!important}.ps-xxl-3{padding-left:1rem!important}.ps-xxl-4{padding-left:1.5rem!important}.ps-xxl-5{padding-left:3rem!important}.gap-xxl-0{gap:0!important}.gap-xxl-1{gap:.25rem!important}.gap-xxl-2{gap:.5rem!important}.gap-xxl-3{gap:1rem!important}.gap-xxl-4{gap:1.5rem!important}.gap-xxl-5{gap:3rem!important}} \ No newline at end of file + :root{--ml-font-sans-serif:"Roboto Flex", roboto, system-ui, -apple-system, blinkmacsystemfont, "Segoe UI", helvetica, arial, ubuntu, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji"}.ml-theme-dark,.ml-theme-light,body,body[data-ml-theme=dark]{--md-sys-color-shadow:#000;--md-sys-color-surface-tint-color:var(--md-sys-color-primary);--md-sys-color-surface-tint:var(--md-sys-color-primary)}.ml-theme-light,body{--md-sys-color-primary:#6750a4;--md-sys-color-primary-container:#eaddff;--md-sys-color-on-primary:#fff;--md-sys-color-on-primary-container:#21005d;--md-sys-color-inverse-primary:#d0bcff;--md-sys-color-secondary:#625b71;--md-sys-color-secondary-container:#e8def8;--md-sys-color-on-secondary:#fff;--md-sys-color-on-secondary-container:#1d192b;--md-sys-color-surface:#fffbfe;--md-sys-color-surface-variant:#e7e0ec;--md-sys-color-on-surface:#1c1b1f;--md-sys-color-on-surface-variant:#49454f;--md-sys-color-inverse-surface:#313033;--md-sys-color-inverse-on-surface:#f4eff4;--md-sys-color-background:#fffbfe;--md-sys-color-on-background:#1c1b1f;--md-sys-color-outline:#79747e;--md-sys-color-error:#b3261e;--md-sys-color-tertiary:#7d5260;--md-sys-color-tertiary-container:#ffd8e4;--md-sys-color-on-tertiary:#fff;--md-sys-color-on-tertiary-container:#31111d;--md-sys-color-error-container:#f9dedc;--md-sys-color-on-error:#fff;--md-sys-color-on-error-container:#410e0b}.ml-theme-dark,body[data-ml-theme=dark]{--md-sys-color-primary:#d0bcff;--md-sys-color-primary-container:#4f378b;--md-sys-color-on-primary:#381e72;--md-sys-color-on-primary-container:#eaddff;--md-sys-color-inverse-primary:#6750a4;--md-sys-color-secondary:#ccc2dc;--md-sys-color-secondary-container:#4a4458;--md-sys-color-on-secondary:#332d41;--md-sys-color-on-secondary-container:#e8def8;--md-sys-color-surface:#1c1b1f;--md-sys-color-surface-variant:#49454f;--md-sys-color-on-surface:#e6e1e5;--md-sys-color-on-surface-variant:#cac4d0;--md-sys-color-inverse-surface:#e6e1e5;--md-sys-color-inverse-on-surface:#313033;--md-sys-color-background:#1c1b1f;--md-sys-color-on-background:#e6e1e5;--md-sys-color-outline:#938f99;--md-sys-color-error:#f2b8b5;--md-sys-color-tertiary:#efb8c8;--md-sys-color-tertiary-container:#633b48;--md-sys-color-on-tertiary:#492532;--md-sys-color-on-tertiary-container:#ffd8e4;--md-sys-color-error-container:#8c1d18;--md-sys-color-on-error:#601410;--md-sys-color-on-error-container:#f2b8b5}body{background:var(--md-sys-color-background)}.container,.container-fluid,.container-lg,.container-md,.container-sm,.container-xl,.container-xxl{--ml-gutter-x:1.5rem;--ml-gutter-y:0;width:100%;padding-right:calc(var(--ml-gutter-x)*.5);padding-left:calc(var(--ml-gutter-x)*.5);margin-right:auto;margin-left:auto}@media (min-width:576px){.container,.container-sm{max-width:540px}}@media (min-width:768px){.container,.container-md,.container-sm{max-width:720px}}@media (min-width:992px){.container,.container-lg,.container-md,.container-sm{max-width:960px}}@media (min-width:1200px){.container,.container-lg,.container-md,.container-sm,.container-xl{max-width:1140px}}@media (min-width:1400px){.container,.container-lg,.container-md,.container-sm,.container-xl,.container-xxl{max-width:1320px}}.row{--ml-gutter-x:1.5rem;--ml-gutter-y:0;display:flex;flex-wrap:wrap;margin-top:calc(-1*var(--ml-gutter-y));margin-right:calc(-.5*var(--ml-gutter-x));margin-left:calc(-.5*var(--ml-gutter-x))}.row>*{box-sizing:border-box;flex-shrink:0;width:100%;max-width:100%;padding-right:calc(var(--ml-gutter-x)*.5);padding-left:calc(var(--ml-gutter-x)*.5);margin-top:var(--ml-gutter-y)}.col{flex:1 0 0}.row-cols-auto>*{flex:0 0 auto;width:auto}.row-cols-1>*{flex:0 0 auto;width:100%}.row-cols-2>*{flex:0 0 auto;width:50%}.row-cols-3>*{flex:0 0 auto;width:33.3333333333%}.row-cols-4>*{flex:0 0 auto;width:25%}.row-cols-5>*{flex:0 0 auto;width:20%}.col-auto,.row-cols-6>*{flex:0 0 auto;width:16.6666666667%}.col-auto{width:auto}.col-1,.col-2{flex:0 0 auto;width:8.3333333333%}.col-2{width:16.6666666667%}.col-3,.col-4{flex:0 0 auto;width:25%}.col-4{width:33.3333333333%}.col-5,.col-6{flex:0 0 auto;width:41.6666666667%}.col-6{width:50%}.col-7,.col-8{flex:0 0 auto;width:58.3333333333%}.col-8{width:66.6666666667%}.col-10,.col-9{flex:0 0 auto;width:75%}.col-10{width:83.3333333333%}.col-11,.col-12{flex:0 0 auto;width:91.6666666667%}.col-12{width:100%}.offset-1{margin-left:8.3333333333%}.offset-2{margin-left:16.6666666667%}.offset-3{margin-left:25%}.offset-4{margin-left:33.3333333333%}.offset-5{margin-left:41.6666666667%}.offset-6{margin-left:50%}.offset-7{margin-left:58.3333333333%}.offset-8{margin-left:66.6666666667%}.offset-9{margin-left:75%}.offset-10{margin-left:83.3333333333%}.offset-11{margin-left:91.6666666667%}.g-0,.gx-0{--ml-gutter-x:0}.g-0,.gy-0{--ml-gutter-y:0}.g-1,.gx-1{--ml-gutter-x:0.25rem}.g-1,.gy-1{--ml-gutter-y:0.25rem}.g-2,.gx-2{--ml-gutter-x:0.5rem}.g-2,.gy-2{--ml-gutter-y:0.5rem}.g-3,.gx-3{--ml-gutter-x:1rem}.g-3,.gy-3{--ml-gutter-y:1rem}.g-4,.gx-4{--ml-gutter-x:1.5rem}.g-4,.gy-4{--ml-gutter-y:1.5rem}.g-5,.gx-5{--ml-gutter-x:3rem}.g-5,.gy-5{--ml-gutter-y:3rem}@media (min-width:576px){.col-sm{flex:1 0 0}.row-cols-sm-auto>*{flex:0 0 auto;width:auto}.row-cols-sm-1>*{flex:0 0 auto;width:100%}.row-cols-sm-2>*{flex:0 0 auto;width:50%}.row-cols-sm-3>*{flex:0 0 auto;width:33.3333333333%}.row-cols-sm-4>*{flex:0 0 auto;width:25%}.row-cols-sm-5>*{flex:0 0 auto;width:20%}.col-sm-auto,.row-cols-sm-6>*{flex:0 0 auto;width:16.6666666667%}.col-sm-auto{width:auto}.col-sm-1,.col-sm-2{flex:0 0 auto;width:8.3333333333%}.col-sm-2{width:16.6666666667%}.col-sm-3,.col-sm-4{flex:0 0 auto;width:25%}.col-sm-4{width:33.3333333333%}.col-sm-5,.col-sm-6{flex:0 0 auto;width:41.6666666667%}.col-sm-6{width:50%}.col-sm-7,.col-sm-8{flex:0 0 auto;width:58.3333333333%}.col-sm-8{width:66.6666666667%}.col-sm-10,.col-sm-9{flex:0 0 auto;width:75%}.col-sm-10{width:83.3333333333%}.col-sm-11,.col-sm-12{flex:0 0 auto;width:91.6666666667%}.col-sm-12{width:100%}.offset-sm-0{margin-left:0}.offset-sm-1{margin-left:8.3333333333%}.offset-sm-2{margin-left:16.6666666667%}.offset-sm-3{margin-left:25%}.offset-sm-4{margin-left:33.3333333333%}.offset-sm-5{margin-left:41.6666666667%}.offset-sm-6{margin-left:50%}.offset-sm-7{margin-left:58.3333333333%}.offset-sm-8{margin-left:66.6666666667%}.offset-sm-9{margin-left:75%}.offset-sm-10{margin-left:83.3333333333%}.offset-sm-11{margin-left:91.6666666667%}.g-sm-0,.gx-sm-0{--ml-gutter-x:0}.g-sm-0,.gy-sm-0{--ml-gutter-y:0}.g-sm-1,.gx-sm-1{--ml-gutter-x:0.25rem}.g-sm-1,.gy-sm-1{--ml-gutter-y:0.25rem}.g-sm-2,.gx-sm-2{--ml-gutter-x:0.5rem}.g-sm-2,.gy-sm-2{--ml-gutter-y:0.5rem}.g-sm-3,.gx-sm-3{--ml-gutter-x:1rem}.g-sm-3,.gy-sm-3{--ml-gutter-y:1rem}.g-sm-4,.gx-sm-4{--ml-gutter-x:1.5rem}.g-sm-4,.gy-sm-4{--ml-gutter-y:1.5rem}.g-sm-5,.gx-sm-5{--ml-gutter-x:3rem}.g-sm-5,.gy-sm-5{--ml-gutter-y:3rem}}@media (min-width:768px){.col-md{flex:1 0 0}.row-cols-md-auto>*{flex:0 0 auto;width:auto}.row-cols-md-1>*{flex:0 0 auto;width:100%}.row-cols-md-2>*{flex:0 0 auto;width:50%}.row-cols-md-3>*{flex:0 0 auto;width:33.3333333333%}.row-cols-md-4>*{flex:0 0 auto;width:25%}.row-cols-md-5>*{flex:0 0 auto;width:20%}.col-md-auto,.row-cols-md-6>*{flex:0 0 auto;width:16.6666666667%}.col-md-auto{width:auto}.col-md-1,.col-md-2{flex:0 0 auto;width:8.3333333333%}.col-md-2{width:16.6666666667%}.col-md-3,.col-md-4{flex:0 0 auto;width:25%}.col-md-4{width:33.3333333333%}.col-md-5,.col-md-6{flex:0 0 auto;width:41.6666666667%}.col-md-6{width:50%}.col-md-7,.col-md-8{flex:0 0 auto;width:58.3333333333%}.col-md-8{width:66.6666666667%}.col-md-10,.col-md-9{flex:0 0 auto;width:75%}.col-md-10{width:83.3333333333%}.col-md-11,.col-md-12{flex:0 0 auto;width:91.6666666667%}.col-md-12{width:100%}.offset-md-0{margin-left:0}.offset-md-1{margin-left:8.3333333333%}.offset-md-2{margin-left:16.6666666667%}.offset-md-3{margin-left:25%}.offset-md-4{margin-left:33.3333333333%}.offset-md-5{margin-left:41.6666666667%}.offset-md-6{margin-left:50%}.offset-md-7{margin-left:58.3333333333%}.offset-md-8{margin-left:66.6666666667%}.offset-md-9{margin-left:75%}.offset-md-10{margin-left:83.3333333333%}.offset-md-11{margin-left:91.6666666667%}.g-md-0,.gx-md-0{--ml-gutter-x:0}.g-md-0,.gy-md-0{--ml-gutter-y:0}.g-md-1,.gx-md-1{--ml-gutter-x:0.25rem}.g-md-1,.gy-md-1{--ml-gutter-y:0.25rem}.g-md-2,.gx-md-2{--ml-gutter-x:0.5rem}.g-md-2,.gy-md-2{--ml-gutter-y:0.5rem}.g-md-3,.gx-md-3{--ml-gutter-x:1rem}.g-md-3,.gy-md-3{--ml-gutter-y:1rem}.g-md-4,.gx-md-4{--ml-gutter-x:1.5rem}.g-md-4,.gy-md-4{--ml-gutter-y:1.5rem}.g-md-5,.gx-md-5{--ml-gutter-x:3rem}.g-md-5,.gy-md-5{--ml-gutter-y:3rem}}@media (min-width:992px){.col-lg{flex:1 0 0}.row-cols-lg-auto>*{flex:0 0 auto;width:auto}.row-cols-lg-1>*{flex:0 0 auto;width:100%}.row-cols-lg-2>*{flex:0 0 auto;width:50%}.row-cols-lg-3>*{flex:0 0 auto;width:33.3333333333%}.row-cols-lg-4>*{flex:0 0 auto;width:25%}.row-cols-lg-5>*{flex:0 0 auto;width:20%}.col-lg-auto,.row-cols-lg-6>*{flex:0 0 auto;width:16.6666666667%}.col-lg-auto{width:auto}.col-lg-1,.col-lg-2{flex:0 0 auto;width:8.3333333333%}.col-lg-2{width:16.6666666667%}.col-lg-3,.col-lg-4{flex:0 0 auto;width:25%}.col-lg-4{width:33.3333333333%}.col-lg-5,.col-lg-6{flex:0 0 auto;width:41.6666666667%}.col-lg-6{width:50%}.col-lg-7,.col-lg-8{flex:0 0 auto;width:58.3333333333%}.col-lg-8{width:66.6666666667%}.col-lg-10,.col-lg-9{flex:0 0 auto;width:75%}.col-lg-10{width:83.3333333333%}.col-lg-11,.col-lg-12{flex:0 0 auto;width:91.6666666667%}.col-lg-12{width:100%}.offset-lg-0{margin-left:0}.offset-lg-1{margin-left:8.3333333333%}.offset-lg-2{margin-left:16.6666666667%}.offset-lg-3{margin-left:25%}.offset-lg-4{margin-left:33.3333333333%}.offset-lg-5{margin-left:41.6666666667%}.offset-lg-6{margin-left:50%}.offset-lg-7{margin-left:58.3333333333%}.offset-lg-8{margin-left:66.6666666667%}.offset-lg-9{margin-left:75%}.offset-lg-10{margin-left:83.3333333333%}.offset-lg-11{margin-left:91.6666666667%}.g-lg-0,.gx-lg-0{--ml-gutter-x:0}.g-lg-0,.gy-lg-0{--ml-gutter-y:0}.g-lg-1,.gx-lg-1{--ml-gutter-x:0.25rem}.g-lg-1,.gy-lg-1{--ml-gutter-y:0.25rem}.g-lg-2,.gx-lg-2{--ml-gutter-x:0.5rem}.g-lg-2,.gy-lg-2{--ml-gutter-y:0.5rem}.g-lg-3,.gx-lg-3{--ml-gutter-x:1rem}.g-lg-3,.gy-lg-3{--ml-gutter-y:1rem}.g-lg-4,.gx-lg-4{--ml-gutter-x:1.5rem}.g-lg-4,.gy-lg-4{--ml-gutter-y:1.5rem}.g-lg-5,.gx-lg-5{--ml-gutter-x:3rem}.g-lg-5,.gy-lg-5{--ml-gutter-y:3rem}}@media (min-width:1200px){.col-xl{flex:1 0 0}.row-cols-xl-auto>*{flex:0 0 auto;width:auto}.row-cols-xl-1>*{flex:0 0 auto;width:100%}.row-cols-xl-2>*{flex:0 0 auto;width:50%}.row-cols-xl-3>*{flex:0 0 auto;width:33.3333333333%}.row-cols-xl-4>*{flex:0 0 auto;width:25%}.row-cols-xl-5>*{flex:0 0 auto;width:20%}.col-xl-auto,.row-cols-xl-6>*{flex:0 0 auto;width:16.6666666667%}.col-xl-auto{width:auto}.col-xl-1,.col-xl-2{flex:0 0 auto;width:8.3333333333%}.col-xl-2{width:16.6666666667%}.col-xl-3,.col-xl-4{flex:0 0 auto;width:25%}.col-xl-4{width:33.3333333333%}.col-xl-5,.col-xl-6{flex:0 0 auto;width:41.6666666667%}.col-xl-6{width:50%}.col-xl-7,.col-xl-8{flex:0 0 auto;width:58.3333333333%}.col-xl-8{width:66.6666666667%}.col-xl-10,.col-xl-9{flex:0 0 auto;width:75%}.col-xl-10{width:83.3333333333%}.col-xl-11,.col-xl-12{flex:0 0 auto;width:91.6666666667%}.col-xl-12{width:100%}.offset-xl-0{margin-left:0}.offset-xl-1{margin-left:8.3333333333%}.offset-xl-2{margin-left:16.6666666667%}.offset-xl-3{margin-left:25%}.offset-xl-4{margin-left:33.3333333333%}.offset-xl-5{margin-left:41.6666666667%}.offset-xl-6{margin-left:50%}.offset-xl-7{margin-left:58.3333333333%}.offset-xl-8{margin-left:66.6666666667%}.offset-xl-9{margin-left:75%}.offset-xl-10{margin-left:83.3333333333%}.offset-xl-11{margin-left:91.6666666667%}.g-xl-0,.gx-xl-0{--ml-gutter-x:0}.g-xl-0,.gy-xl-0{--ml-gutter-y:0}.g-xl-1,.gx-xl-1{--ml-gutter-x:0.25rem}.g-xl-1,.gy-xl-1{--ml-gutter-y:0.25rem}.g-xl-2,.gx-xl-2{--ml-gutter-x:0.5rem}.g-xl-2,.gy-xl-2{--ml-gutter-y:0.5rem}.g-xl-3,.gx-xl-3{--ml-gutter-x:1rem}.g-xl-3,.gy-xl-3{--ml-gutter-y:1rem}.g-xl-4,.gx-xl-4{--ml-gutter-x:1.5rem}.g-xl-4,.gy-xl-4{--ml-gutter-y:1.5rem}.g-xl-5,.gx-xl-5{--ml-gutter-x:3rem}.g-xl-5,.gy-xl-5{--ml-gutter-y:3rem}}@media (min-width:1400px){.col-xxl{flex:1 0 0}.row-cols-xxl-auto>*{flex:0 0 auto;width:auto}.row-cols-xxl-1>*{flex:0 0 auto;width:100%}.row-cols-xxl-2>*{flex:0 0 auto;width:50%}.row-cols-xxl-3>*{flex:0 0 auto;width:33.3333333333%}.row-cols-xxl-4>*{flex:0 0 auto;width:25%}.row-cols-xxl-5>*{flex:0 0 auto;width:20%}.row-cols-xxl-6>*{flex:0 0 auto;width:16.6666666667%}.col-xxl-auto{flex:0 0 auto;width:auto}.col-xxl-1,.col-xxl-2{flex:0 0 auto;width:8.3333333333%}.col-xxl-2{width:16.6666666667%}.col-xxl-3,.col-xxl-4{flex:0 0 auto;width:25%}.col-xxl-4{width:33.3333333333%}.col-xxl-5,.col-xxl-6{flex:0 0 auto;width:41.6666666667%}.col-xxl-6{width:50%}.col-xxl-7,.col-xxl-8{flex:0 0 auto;width:58.3333333333%}.col-xxl-8{width:66.6666666667%}.col-xxl-10,.col-xxl-9{flex:0 0 auto;width:75%}.col-xxl-10{width:83.3333333333%}.col-xxl-11,.col-xxl-12{flex:0 0 auto;width:91.6666666667%}.col-xxl-12{width:100%}.offset-xxl-0{margin-left:0}.offset-xxl-1{margin-left:8.3333333333%}.offset-xxl-2{margin-left:16.6666666667%}.offset-xxl-3{margin-left:25%}.offset-xxl-4{margin-left:33.3333333333%}.offset-xxl-5{margin-left:41.6666666667%}.offset-xxl-6{margin-left:50%}.offset-xxl-7{margin-left:58.3333333333%}.offset-xxl-8{margin-left:66.6666666667%}.offset-xxl-9{margin-left:75%}.offset-xxl-10{margin-left:83.3333333333%}.offset-xxl-11{margin-left:91.6666666667%}.g-xxl-0,.gx-xxl-0{--ml-gutter-x:0}.g-xxl-0,.gy-xxl-0{--ml-gutter-y:0}.g-xxl-1,.gx-xxl-1{--ml-gutter-x:0.25rem}.g-xxl-1,.gy-xxl-1{--ml-gutter-y:0.25rem}.g-xxl-2,.gx-xxl-2{--ml-gutter-x:0.5rem}.g-xxl-2,.gy-xxl-2{--ml-gutter-y:0.5rem}.g-xxl-3,.gx-xxl-3{--ml-gutter-x:1rem}.g-xxl-3,.gy-xxl-3{--ml-gutter-y:1rem}.g-xxl-4,.gx-xxl-4{--ml-gutter-x:1.5rem}.g-xxl-4,.gy-xxl-4{--ml-gutter-y:1.5rem}.g-xxl-5,.gx-xxl-5{--ml-gutter-x:3rem}.g-xxl-5,.gy-xxl-5{--ml-gutter-y:3rem}}.group{display:flex}.group-inline{display:inline-flex}.card{box-sizing:border-box;transition-property:background-color,box-shadow;transition-duration:150ms;transition-timing-function:cubic-bezier(.4,0,.2,1)}.card,.card-image-top{border-radius:.75rem}.card-elevated{background:#f7f2fa;box-shadow:0 .0625rem .125rem 0 rgba(0,0,0,.3),0 .0625rem .1875rem .0625rem rgba(0,0,0,.15)}.card-elevated:hover:not(:disabled).card-hover{background:#e2dce6;box-shadow:0 .0625rem .125rem 0 rgba(0,0,0,.3),0 .125rem .375rem .125rem rgba(0,0,0,.15)}.ml-theme-dark .card-elevated,body[data-ml-theme=dark] .card-elevated{background:#25232a;box-shadow:0 .0625rem .125rem 0 rgba(0,0,0,.3),0 .0625rem .1875rem .0625rem rgba(0,0,0,.15)}.ml-theme-dark .card-elevated:hover:not(:disabled).card-hover,body[data-ml-theme=dark] .card-elevated:hover:not(:disabled).card-hover{background:#39373f;box-shadow:0 .0625rem .125rem 0 rgba(0,0,0,.3),0 .125rem .375rem .125rem rgba(0,0,0,.15)}.card-filled{background:#e7e0ec}.card-filled:hover:not(:disabled).card-hover{background:#d1cad8;box-shadow:0 .0625rem .125rem 0 rgba(0,0,0,.3),0 .0625rem .1875rem .0625rem rgba(0,0,0,.15)}.ml-theme-dark .card-filled,body[data-ml-theme=dark] .card-filled{background:#49454f}.ml-theme-dark .card-filled:hover:not(:disabled).card-hover,body[data-ml-theme=dark] .card-filled:hover:not(:disabled).card-hover{background:#5c5763;box-shadow:0 .0625rem .125rem 0 rgba(0,0,0,.3),0 .0625rem .1875rem .0625rem rgba(0,0,0,.15)}.card-outlined{background:#fffbfe;border:solid thin #79747e}.card-outlined:hover:not(:disabled).card-hover,.ml-theme-dark .card-outlined:hover:not(:disabled).card-hover,body[data-ml-theme=dark] .card-outlined:hover:not(:disabled).card-hover{box-shadow:0 .0625rem .125rem 0 rgba(0,0,0,.3),0 .0625rem .1875rem .0625rem rgba(0,0,0,.15)}.ml-theme-dark .card-outlined,body[data-ml-theme=dark] .card-outlined{background:#1c1b1f;border:solid thin #938f99}.card-image,.card-image-top{width:100%}.card-body{padding:0 1rem}.nav-drawer{background:#fffbfe;border-radius:0 1rem 1rem 0;width:22.5rem;padding:.75rem 0;box-sizing:border-box}.nav-drawer .nav-drawer-headline{color:#49454f;margin:0;padding:1rem 1.75rem}.nav-drawer .nav-drawer-break{height:.0625rem;margin:0 1.75rem;border:0;background:#49454f}.nav-drawer .nav-drawer-item{-webkit-tap-highlight-color:transparent;display:flex;height:3.5rem;padding:0 1.5rem 0 1rem;margin:0 .75rem;gap:.75rem;border-radius:1.75rem;align-items:center;background:#fffbfe;color:#49454f;font-family:var(--ml-font-sans-serif);font-size:.875rem;line-height:1.25rem;letter-spacing:.00625rem;font-weight:500;text-decoration:none;box-sizing:border-box;transition-property:background-color,color;transition-duration:150ms;transition-timing-function:cubic-bezier(.4,0,.2,1)}.nav-drawer .nav-drawer-item:focus-visible{outline:0}.nav-drawer .nav-drawer-item:disabled{cursor:auto}.nav-drawer .nav-drawer-item.nav-drawer-item-active{background:#e8def8;color:#1d192b}.nav-drawer .nav-drawer-item:hover:not(:disabled){background:#ede9ec;color:#1c1b1f}.nav-drawer .nav-drawer-item:hover:not(:disabled).nav-drawer-item-active{background:#ede9ed;color:#1d192b}.nav-drawer .nav-drawer-item:focus-visible:not(:disabled){background:#e4e0e3;color:#1c1b1f}.nav-drawer .nav-drawer-item:focus-visible:not(:disabled).nav-drawer-item-active{background:#e4e0e5;color:#1d192b}.nav-drawer .nav-drawer-item.nav-drawer-item-active:active:not(:disabled),.nav-drawer .nav-drawer-item:active:not(:disabled){background:#e4e0e5;color:#1c1b1f}.nav-drawer .nav-drawer-item.nav-drawer-item-active:active:not(:disabled).nav-drawer-item-active,.nav-drawer .nav-drawer-item:active:not(:disabled).nav-drawer-item-active{color:#1d192b}.nav-drawer .nav-drawer-item .nav-drawer-item-icon{font-size:1.5rem}.ml-theme-dark .nav-drawer,body[data-ml-theme=dark] .nav-drawer{background:#1c1b1f}.ml-theme-dark .nav-drawer .nav-drawer-headline,body[data-ml-theme=dark] .nav-drawer .nav-drawer-headline{color:#cac4d0}.ml-theme-dark .nav-drawer .nav-drawer-item,body[data-ml-theme=dark] .nav-drawer .nav-drawer-item{background:#1c1b1f;color:#cac4d0}.ml-theme-dark .nav-drawer .nav-drawer-item.nav-drawer-item-active,body[data-ml-theme=dark] .nav-drawer .nav-drawer-item.nav-drawer-item-active{background:#4a4458;color:#e8def8}.ml-theme-dark .nav-drawer .nav-drawer-item:hover:not(:disabled),body[data-ml-theme=dark] .nav-drawer .nav-drawer-item:hover:not(:disabled){background:#2c2b2f;color:#e6e1e5}.ml-theme-dark .nav-drawer .nav-drawer-item:hover:not(:disabled).nav-drawer-item-active,body[data-ml-theme=dark] .nav-drawer .nav-drawer-item:hover:not(:disabled).nav-drawer-item-active{background:#2c2b30;color:#e8def8}.ml-theme-dark .nav-drawer .nav-drawer-item:focus-visible:not(:disabled),body[data-ml-theme=dark] .nav-drawer .nav-drawer-item:focus-visible:not(:disabled){background:#343337;color:#e6e1e5}.ml-theme-dark .nav-drawer .nav-drawer-item:focus-visible:not(:disabled).nav-drawer-item-active,body[data-ml-theme=dark] .nav-drawer .nav-drawer-item:focus-visible:not(:disabled).nav-drawer-item-active{background:#343239;color:#e8def8}.ml-theme-dark .nav-drawer .nav-drawer-item:active:not(:disabled),body[data-ml-theme=dark] .nav-drawer .nav-drawer-item:active:not(:disabled){background:#343239;color:#e6e1e5}.ml-theme-dark .nav-drawer .nav-drawer-item:active:not(:disabled).nav-drawer-item-active,body[data-ml-theme=dark] .nav-drawer .nav-drawer-item:active:not(:disabled).nav-drawer-item-active{color:#e8def8}.nav-drawer-modal{background:#f7f2fa;border-radius:0 1rem 1rem 0;width:22.5rem;padding:.75rem 0;box-sizing:border-box;position:fixed;height:100vh}.nav-drawer-modal .nav-drawer-modal-headline{color:#49454f;margin:0;padding:1rem 1.75rem}.nav-drawer-modal .nav-drawer-modal-break{height:.0625rem;margin:0 1.75rem;border:0;background:#49454f}.nav-drawer-modal .nav-drawer-modal-item{-webkit-tap-highlight-color:transparent;display:flex;height:3.5rem;padding:0 1.5rem 0 1rem;margin:0 .75rem;gap:.75rem;border-radius:1.75rem;align-items:center;background:#f7f2fa;color:#49454f;font-family:var(--ml-font-sans-serif);font-size:.875rem;line-height:1.25rem;letter-spacing:.00625rem;font-weight:500;text-decoration:none;box-sizing:border-box;transition-property:background-color,color;transition-duration:150ms;transition-timing-function:cubic-bezier(.4,0,.2,1)}.nav-drawer-modal .nav-drawer-modal-item:focus-visible{outline:0}.nav-drawer-modal .nav-drawer-modal-item:disabled{cursor:auto}.nav-drawer-modal .nav-drawer-modal-item.nav-drawer-modal-item-active{background:#e2d7f4;color:#1d192b}.nav-drawer-modal .nav-drawer-modal-item:hover:not(:disabled){background:#e5e1e8;color:#1c1b1f}.nav-drawer-modal .nav-drawer-modal-item:hover:not(:disabled).nav-drawer-modal-item-active{background:#e6e1e9;color:#1d192b}.nav-drawer-modal .nav-drawer-modal-item:focus-visible:not(:disabled){background:#ddd8e0;color:#1c1b1f}.nav-drawer-modal .nav-drawer-modal-item:focus-visible:not(:disabled).nav-drawer-modal-item-active{background:#ddd8e1;color:#1d192b}.nav-drawer-modal .nav-drawer-modal-item.nav-drawer-modal-item-active:active:not(:disabled),.nav-drawer-modal .nav-drawer-modal-item:active:not(:disabled){background:#ddd8e1;color:#1c1b1f}.nav-drawer-modal .nav-drawer-modal-item.nav-drawer-modal-item-active:active:not(:disabled).nav-drawer-modal-item-active,.nav-drawer-modal .nav-drawer-modal-item:active:not(:disabled).nav-drawer-modal-item-active{color:#1d192b}.nav-drawer-modal .nav-drawer-modal-item .nav-drawer-modal-item-icon{font-size:1.5rem}.ml-theme-dark .nav-drawer-modal,body[data-ml-theme=dark] .nav-drawer-modal{background:#25232a}.ml-theme-dark .nav-drawer-modal .nav-drawer-modal-headline,body[data-ml-theme=dark] .nav-drawer-modal .nav-drawer-modal-headline{color:#cac4d0}.ml-theme-dark .nav-drawer-modal .nav-drawer-modal-item,body[data-ml-theme=dark] .nav-drawer-modal .nav-drawer-modal-item{background:#25232a;color:#cac4d0}.ml-theme-dark .nav-drawer-modal .nav-drawer-modal-item.nav-drawer-modal-item-active,body[data-ml-theme=dark] .nav-drawer-modal .nav-drawer-modal-item.nav-drawer-modal-item-active{background:#514a60;color:#e8def8}.ml-theme-dark .nav-drawer-modal .nav-drawer-modal-item:hover:not(:disabled),body[data-ml-theme=dark] .nav-drawer-modal .nav-drawer-modal-item:hover:not(:disabled){background:#343239;color:#e6e1e5}.ml-theme-dark .nav-drawer-modal .nav-drawer-modal-item:hover:not(:disabled).nav-drawer-modal-item-active,body[data-ml-theme=dark] .nav-drawer-modal .nav-drawer-modal-item:hover:not(:disabled).nav-drawer-modal-item-active{background:#35323a;color:#e8def8}.ml-theme-dark .nav-drawer-modal .nav-drawer-modal-item:focus-visible:not(:disabled),body[data-ml-theme=dark] .nav-drawer-modal .nav-drawer-modal-item:focus-visible:not(:disabled){background:#3c3a40;color:#e6e1e5}.ml-theme-dark .nav-drawer-modal .nav-drawer-modal-item:focus-visible:not(:disabled).nav-drawer-modal-item-active,body[data-ml-theme=dark] .nav-drawer-modal .nav-drawer-modal-item:focus-visible:not(:disabled).nav-drawer-modal-item-active{background:#3c3943;color:#e8def8}.ml-theme-dark .nav-drawer-modal .nav-drawer-modal-item:active:not(:disabled),body[data-ml-theme=dark] .nav-drawer-modal .nav-drawer-modal-item:active:not(:disabled){background:#3c3943;color:#e6e1e5}.ml-theme-dark .nav-drawer-modal .nav-drawer-modal-item:active:not(:disabled).nav-drawer-modal-item-active,body[data-ml-theme=dark] .nav-drawer-modal .nav-drawer-modal-item:active:not(:disabled).nav-drawer-modal-item-active{color:#e8def8}.button{-webkit-tap-highlight-color:transparent;display:inline-flex;justify-content:center;align-items:center;gap:.5em;white-space:nowrap;border:0;cursor:pointer;text-decoration:none;font-family:var(--ml-font-sans-serif);font-size:.875rem;line-height:1.25rem;letter-spacing:.00625rem;font-weight:500;height:2.5rem;border-radius:1.25rem;transition-property:background-color,box-shadow;transition-duration:150ms;transition-timing-function:cubic-bezier(.4,0,.2,1)}.button:focus-visible{outline:0}.button:disabled{cursor:auto}.button .button-icon{font-size:1.125rem}.button-elevated{color:#6750a4;background:#f7f2fa;padding:0 1.5rem;box-shadow:0 .0625rem .125rem 0 rgba(0,0,0,.3),0 .0625rem .1875rem .0625rem rgba(0,0,0,.15)}.button-elevated:disabled{color:rgba(28,27,31,.38);background:rgba(28,27,31,.12);box-shadow:unset}.button-elevated:hover:not(:disabled){background:#e8e0f0;box-shadow:0 .0625rem .125rem 0 rgba(0,0,0,.3),0 .125rem .375rem .125rem rgba(0,0,0,.15)}.button-elevated:focus-visible:not(:disabled){background:#e6dff0;box-shadow:0 .0625rem .125rem 0 rgba(0,0,0,.3),0 .0625rem .1875rem .0625rem rgba(0,0,0,.15)}.button-elevated:active:not(:disabled){background:#e6dff0;box-shadow:0 .0625rem .125rem 0 rgba(0,0,0,.3),0 .0625rem .1875rem .0625rem rgba(0,0,0,.15)}.ml-theme-dark .button-elevated,body[data-ml-theme=dark] .button-elevated{color:#d0bcff;background:#25232a;box-shadow:0 .0625rem .125rem 0 rgba(0,0,0,.3),0 .0625rem .1875rem .0625rem rgba(0,0,0,.15)}.ml-theme-dark .button-elevated:disabled,body[data-ml-theme=dark] .button-elevated:disabled{color:rgba(230,225,229,.38);background:rgba(230,225,229,.12);box-shadow:unset}.ml-theme-dark .button-elevated:hover:not(:disabled),body[data-ml-theme=dark] .button-elevated:hover:not(:disabled){background:#373441;box-shadow:0 .0625rem .125rem 0 rgba(0,0,0,.3),0 .125rem .375rem .125rem rgba(0,0,0,.15)}.ml-theme-dark .button-elevated:focus-visible:not(:disabled),body[data-ml-theme=dark] .button-elevated:focus-visible:not(:disabled){background:#3a3544;box-shadow:0 .0625rem .125rem 0 rgba(0,0,0,.3),0 .0625rem .1875rem .0625rem rgba(0,0,0,.15)}.ml-theme-dark .button-elevated:active:not(:disabled),body[data-ml-theme=dark] .button-elevated:active:not(:disabled){background:#3a3544;box-shadow:0 .0625rem .125rem 0 rgba(0,0,0,.3),0 .0625rem .1875rem .0625rem rgba(0,0,0,.15)}.button-elevated.button-with-icon{padding:0 1.5rem 0 1rem}.button-filled{color:#fff;background:#6750a4;padding:0 1.5rem;box-shadow:unset}.button-filled:disabled{color:rgba(28,27,31,.38);background:rgba(28,27,31,.12);box-shadow:unset}.button-filled:hover:not(:disabled){background:#735eab;box-shadow:0 .0625rem .125rem 0 rgba(0,0,0,.3),0 .0625rem .1875rem .0625rem rgba(0,0,0,.15)}.button-filled:focus-visible:not(:disabled){background:#7965af;box-shadow:unset}.button-filled:active:not(:disabled){background:#735eab;box-shadow:unset}.ml-theme-dark .button-filled,body[data-ml-theme=dark] .button-filled{color:#381e72;background:#d0bcff;box-shadow:unset}.ml-theme-dark .button-filled:disabled,body[data-ml-theme=dark] .button-filled:disabled{color:rgba(230,225,229,.38);background:rgba(230,225,229,.12);box-shadow:unset}.ml-theme-dark .button-filled:hover:not(:disabled),body[data-ml-theme=dark] .button-filled:hover:not(:disabled){background:#c4aff4;box-shadow:0 .0625rem .125rem 0 rgba(0,0,0,.3),0 .0625rem .1875rem .0625rem rgba(0,0,0,.15)}.ml-theme-dark .button-filled:focus-visible:not(:disabled),body[data-ml-theme=dark] .button-filled:focus-visible:not(:disabled){background:#bea9ee;box-shadow:unset}.ml-theme-dark .button-filled:active:not(:disabled),body[data-ml-theme=dark] .button-filled:active:not(:disabled){background:#c4aff4;box-shadow:unset}.button-tonal{color:#1d192b;background:#e8def8;padding:0 1.5rem;box-shadow:unset}.button-tonal:disabled{color:rgba(28,27,31,.38);background:rgba(28,27,31,.12);box-shadow:unset}.button-tonal:hover:not(:disabled){background:#d8cee8;box-shadow:0 .0625rem .125rem 0 rgba(0,0,0,.3),0 .0625rem .1875rem .0625rem rgba(0,0,0,.15)}.button-tonal:focus-visible:not(:disabled){background:#d0c6df;box-shadow:unset}.button-tonal:active:not(:disabled){background:#d0c6df;box-shadow:unset}.ml-theme-dark .button-tonal,body[data-ml-theme=dark] .button-tonal{color:#e8def8;background:#4a4458;box-shadow:unset}.ml-theme-dark .button-tonal:disabled,body[data-ml-theme=dark] .button-tonal:disabled{color:rgba(230,225,229,.38);background:rgba(230,225,229,.12);box-shadow:unset}.ml-theme-dark .button-tonal:hover:not(:disabled),body[data-ml-theme=dark] .button-tonal:hover:not(:disabled){background:#575065;box-shadow:0 .0625rem .125rem 0 rgba(0,0,0,.3),0 .0625rem .1875rem .0625rem rgba(0,0,0,.15)}.ml-theme-dark .button-tonal:focus-visible:not(:disabled),body[data-ml-theme=dark] .button-tonal:focus-visible:not(:disabled){background:#5d566b;box-shadow:unset}.ml-theme-dark .button-tonal:active:not(:disabled),body[data-ml-theme=dark] .button-tonal:active:not(:disabled){background:#5d566b;box-shadow:unset}.button-outlined{color:#6750a4;border:solid thin #79747e;background:0 0;padding:0 1.5rem}.button-outlined:disabled{color:rgba(28,27,31,.38);border-color:rgba(28,27,31,.12)}.button-outlined:hover:not(:disabled){background:rgba(103,80,164,.08)}.button-outlined:focus-visible:not(:disabled){border-color:#6750a4;background:rgba(103,80,164,.12)}.button-outlined:active:not(:disabled){background:rgba(103,80,164,.12)}.ml-theme-dark .button-outlined,body[data-ml-theme=dark] .button-outlined{color:#d0bcff;border:solid thin #938f99}.ml-theme-dark .button-outlined:disabled,body[data-ml-theme=dark] .button-outlined:disabled{color:rgba(230,225,229,.38);border-color:rgba(230,225,229,.12)}.ml-theme-dark .button-outlined:hover:not(:disabled),body[data-ml-theme=dark] .button-outlined:hover:not(:disabled){background:rgba(208,188,255,.08)}.ml-theme-dark .button-outlined:focus-visible:not(:disabled),body[data-ml-theme=dark] .button-outlined:focus-visible:not(:disabled){border-color:#d0bcff;background:rgba(208,188,255,.12)}.ml-theme-dark .button-outlined:active:not(:disabled),body[data-ml-theme=dark] .button-outlined:active:not(:disabled){background:rgba(208,188,255,.12)}.button-text{color:#6750a4;background:0 0;padding:0 .75rem}.button-text:disabled{color:rgba(28,27,31,.38)}.button-text:hover:not(:disabled){background:rgba(103,80,164,.08)}.button-text:focus-visible:not(:disabled){background:rgba(103,80,164,.12)}.button-text:active:not(:disabled){background:rgba(103,80,164,.12)}.ml-theme-dark .button-text,body[data-ml-theme=dark] .button-text{color:#d0bcff}.ml-theme-dark .button-text:disabled,body[data-ml-theme=dark] .button-text:disabled{color:rgba(230,225,229,.38)}.ml-theme-dark .button-text:hover:not(:disabled),body[data-ml-theme=dark] .button-text:hover:not(:disabled){background:rgba(208,188,255,.08)}.ml-theme-dark .button-text:focus-visible:not(:disabled),body[data-ml-theme=dark] .button-text:focus-visible:not(:disabled){background:rgba(208,188,255,.12)}.ml-theme-dark .button-text:active:not(:disabled),body[data-ml-theme=dark] .button-text:active:not(:disabled){background:rgba(208,188,255,.12)}.field-text{position:relative;height:3.5rem;box-sizing:border-box;transition-property:background-color;transition-duration:150ms;transition-timing-function:cubic-bezier(.4,0,.2,1)}.field-text .field-text-input{height:100%;width:100%;background:0 0;box-sizing:border-box;border:0;color:#1c1b1f;caret-color:#6750a4;font-family:"Roboto Flex",roboto,system-ui,-apple-system,blinkmacsystemfont,"Segoe UI",helvetica,arial,ubuntu,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji";line-height:1.5rem;font-size:1rem;font-weight:400;letter-spacing:.03125rem}.field-text .field-text-input:focus{outline:0}.field-text .field-text-input::placeholder{color:#49454f}.field-text.field-text-filled{background:#e7e0ec;border-radius:.25rem .25rem 0 0}.field-text.field-text-filled .field-text-input{padding:1.25rem 1rem .5rem}.field-text.field-text-outlined .field-text-input{padding:0 1rem}.field-text.field-text-outlined .field-text-label{background:inherit;z-index:1}.field-text.field-text-filled::after{content:" ";position:absolute;left:0;bottom:0;width:100%;border-bottom:.0625rem solid #49454f;transition-property:border-color,border-width;transition-duration:150ms;transition-timing-function:cubic-bezier(.4,0,.2,1);user-select:none;pointer-events:none}.field-text.field-text-outlined::after{content:" ";top:0;left:0;width:100%;height:100%;border:.0625rem solid #79747e;border-radius:.25rem;transition-property:border-color,border-width;box-sizing:border-box}.field-text .field-text-icon-leading{position:absolute;top:50%;left:.75rem;transform:translateY(-50%);user-select:none;pointer-events:none;color:#49454f;font-size:1.5rem;line-height:0}.field-text .field-text-icon-trailing,.field-text .field-text-label,.field-text.field-text-outlined::after{position:absolute;user-select:none;pointer-events:none;transition-duration:150ms;transition-timing-function:cubic-bezier(.4,0,.2,1)}.field-text .field-text-icon-trailing,.field-text .field-text-label{top:50%;transform:translateY(-50%);color:#49454f}.field-text .field-text-label{left:1rem;margin-right:1rem;font-family:"Roboto Flex",roboto,system-ui,-apple-system,blinkmacsystemfont,"Segoe UI",helvetica,arial,ubuntu,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji";line-height:1.5rem;font-size:1rem;font-weight:400;letter-spacing:.03125rem;transition-property:color,transform,top,font-size,line-height,left,padding}.field-text .field-text-icon-trailing{right:.75rem;font-size:1.5rem;line-height:0;transition-property:color}.field-text:has(>.field-text-icon-leading) .field-text-input{padding-left:3.25rem}.field-text:has(>.field-text-icon-leading).field-text-filled .field-text-label,.field-text:has(>.field-text-input:placeholder-shown):has(>.field-text-input:not(:focus)):has(>.field-text-icon-leading).field-text-outlined .field-text-label{left:3.25rem}.field-text:has(>.field-text-icon-trailing) .field-text-input{padding-right:3.25rem}.field-text:has(>.field-text-icon-trailing) .field-text-label{margin-right:3.25rem}.field-text .field-text-input:-webkit-autofill,.field-text .field-text-input:-webkit-autofill:focus{transition:background-color 2147483647s 0s,color 2147483647s 0s!important}.field-text:has(>.field-text-input:disabled).field-text-filled{background:rgba(28,27,31,.04)}.field-text:has(>.field-text-input:disabled).field-text-filled::after{border-color:rgba(28,27,31,.38)}.field-text:has(>.field-text-input:disabled) .field-text-icon-leading,.field-text:has(>.field-text-input:disabled) .field-text-icon-trailing,.field-text:has(>.field-text-input:disabled) .field-text-input,.field-text:has(>.field-text-input:disabled) .field-text-label{color:rgba(28,27,31,.38)}.field-text:focus-within:not(:has(>.field-text-input:disabled)).field-text-filled .field-text-label,.field-text:has(>.field-text-input:not(:placeholder-shown)).field-text-filled .field-text-label{top:.5rem}.field-text:focus-within:not(:has(>.field-text-input:disabled)).field-text-outlined .field-text-label,.field-text:has(>.field-text-input:not(:placeholder-shown)).field-text-outlined .field-text-label{top:-.475rem;padding:0 .25rem}.field-text:focus-within:not(:has(>.field-text-input:disabled)) .field-text-label,.field-text:has(>.field-text-input:not(:placeholder-shown)) .field-text-label{transform:translateY(0);line-height:1rem;font-size:.75rem}.field-text:focus-within:not(:has(>.field-text-input:disabled)).field-text-filled::after{border-bottom:.125rem solid #6750a4}.field-text:focus-within:not(:has(>.field-text-input:disabled)).field-text-outlined::after{border-width:.125rem;border-color:#6750a4}.field-text:focus-within:not(:has(>.field-text-input:disabled)) .field-text-label{color:#6750a4}.field-text:hover:not(:has(>.field-text-input:disabled)):not(:focus-within).field-text-filled{background:#d7d0dc}.field-text:hover:not(:has(>.field-text-input:disabled)):not(:focus-within).field-text-outlined::after{border-color:#6750a4}.field-text:hover:not(:has(>.field-text-input:disabled)):not(:focus-within).field-text-outlined .field-text-label{color:#1c1b1f}.field-text:not(:has(>.field-text-input:disabled)):has(>.field-text-input:invalid)::after{border-color:#b3261e}.field-text:not(:has(>.field-text-input:disabled)):has(>.field-text-input:invalid) .field-text-icon-trailing,.field-text:not(:has(>.field-text-input:disabled)):has(>.field-text-input:invalid) .field-text-label{color:#b3261e}.field-text:not(:has(>.field-text-input:disabled)):has(>.field-text-input:invalid) .field-text-input{caret-color:#b3261e}.field-text:not(:has(>.field-text-input:disabled)):has(>.field-text-input:invalid):hover:not(:has(>.field-text-input:disabled)):not(:focus-within).field-text-filled{background:#d7d0dc}.field-text:not(:has(>.field-text-input:disabled)):has(>.field-text-input:invalid):hover:not(:has(>.field-text-input:disabled)):not(:focus-within).field-text-filled::after{border-color:#410e0b}.field-text:not(:has(>.field-text-input:disabled)):has(>.field-text-input:invalid):hover:not(:has(>.field-text-input:disabled)):not(:focus-within) .field-text-icon-trailing,.field-text:not(:has(>.field-text-input:disabled)):has(>.field-text-input:invalid):hover:not(:has(>.field-text-input:disabled)):not(:focus-within) .field-text-label{color:#410e0b}.ml-theme-dark .field-text.field-text-filled,body[data-ml-theme=dark] .field-text.field-text-filled{background:#49454f}.ml-theme-dark .field-text.field-text-outlined,body[data-ml-theme=dark] .field-text.field-text-outlined{border-color:#938f99}.ml-theme-dark .field-text.field-text-filled::after,body[data-ml-theme=dark] .field-text.field-text-filled::after{border-color:#cac4d0}.ml-theme-dark .field-text .field-text-input,body[data-ml-theme=dark] .field-text .field-text-input{color:#e6e1e5;caret-color:#d0bcff}.ml-theme-dark .field-text .field-text-input::placeholder,body[data-ml-theme=dark] .field-text .field-text-input::placeholder{color:#cac4d0}.ml-theme-dark .field-text .field-text-icon-leading,.ml-theme-dark .field-text .field-text-icon-trailing,.ml-theme-dark .field-text .field-text-label,body[data-ml-theme=dark] .field-text .field-text-icon-leading,body[data-ml-theme=dark] .field-text .field-text-icon-trailing,body[data-ml-theme=dark] .field-text .field-text-label{color:#cac4d0}.ml-theme-dark .field-text:has(>.field-text-input:disabled).field-text-filled,body[data-ml-theme=dark] .field-text:has(>.field-text-input:disabled).field-text-filled{background:rgba(230,225,229,.04)}.ml-theme-dark .field-text:has(>.field-text-input:disabled).field-text-filled::after,body[data-ml-theme=dark] .field-text:has(>.field-text-input:disabled).field-text-filled::after{border-color:rgba(230,225,229,.38)}.ml-theme-dark .field-text:has(>.field-text-input:disabled) .field-text-icon-leading,.ml-theme-dark .field-text:has(>.field-text-input:disabled) .field-text-icon-trailing,.ml-theme-dark .field-text:has(>.field-text-input:disabled) .field-text-input,.ml-theme-dark .field-text:has(>.field-text-input:disabled) .field-text-label,body[data-ml-theme=dark] .field-text:has(>.field-text-input:disabled) .field-text-icon-leading,body[data-ml-theme=dark] .field-text:has(>.field-text-input:disabled) .field-text-icon-trailing,body[data-ml-theme=dark] .field-text:has(>.field-text-input:disabled) .field-text-input,body[data-ml-theme=dark] .field-text:has(>.field-text-input:disabled) .field-text-label{color:rgba(230,225,229,.38)}.ml-theme-dark .field-text:focus-within:not(:has(>.field-text-input:disabled)).field-text-filled::after,body[data-ml-theme=dark] .field-text:focus-within:not(:has(>.field-text-input:disabled)).field-text-filled::after{border-color:#d0bcff}.ml-theme-dark .field-text:focus-within:not(:has(>.field-text-input:disabled)) .field-text-label,body[data-ml-theme=dark] .field-text:focus-within:not(:has(>.field-text-input:disabled)) .field-text-label{color:#d0bcff}.ml-theme-dark .field-text:hover:not(:has(>.field-text-input:disabled)):not(:focus-within).field-text-filled,body[data-ml-theme=dark] .field-text:hover:not(:has(>.field-text-input:disabled)):not(:focus-within).field-text-filled{background:#56515b}.ml-theme-dark .field-text:not(:has(>.field-text-input:disabled)):has(>.field-text-input:invalid).field-text-filled::after,body[data-ml-theme=dark] .field-text:not(:has(>.field-text-input:disabled)):has(>.field-text-input:invalid).field-text-filled::after{border-color:#f2b8b5}.ml-theme-dark .field-text:not(:has(>.field-text-input:disabled)):has(>.field-text-input:invalid) .field-text-icon-trailing,.ml-theme-dark .field-text:not(:has(>.field-text-input:disabled)):has(>.field-text-input:invalid) .field-text-label,body[data-ml-theme=dark] .field-text:not(:has(>.field-text-input:disabled)):has(>.field-text-input:invalid) .field-text-icon-trailing,body[data-ml-theme=dark] .field-text:not(:has(>.field-text-input:disabled)):has(>.field-text-input:invalid) .field-text-label{color:#f2b8b5}.ml-theme-dark .field-text:not(:has(>.field-text-input:disabled)):has(>.field-text-input:invalid) .field-text-input,body[data-ml-theme=dark] .field-text:not(:has(>.field-text-input:disabled)):has(>.field-text-input:invalid) .field-text-input{caret-color:#f2b8b5}.ml-theme-dark .field-text:not(:has(>.field-text-input:disabled)):has(>.field-text-input:invalid):hover:not(:has(>.field-text-input:disabled)):not(:focus-within).field-text-filled,body[data-ml-theme=dark] .field-text:not(:has(>.field-text-input:disabled)):has(>.field-text-input:invalid):hover:not(:has(>.field-text-input:disabled)):not(:focus-within).field-text-filled{background:#56515b}.ml-theme-dark .field-text:not(:has(>.field-text-input:disabled)):has(>.field-text-input:invalid):hover:not(:has(>.field-text-input:disabled)):not(:focus-within).field-text-filled::after,body[data-ml-theme=dark] .field-text:not(:has(>.field-text-input:disabled)):has(>.field-text-input:invalid):hover:not(:has(>.field-text-input:disabled)):not(:focus-within).field-text-filled::after{border-color:#f2b8b5}.ml-theme-dark .field-text:not(:has(>.field-text-input:disabled)):has(>.field-text-input:invalid):hover:not(:has(>.field-text-input:disabled)):not(:focus-within) .field-text-icon-trailing,.ml-theme-dark .field-text:not(:has(>.field-text-input:disabled)):has(>.field-text-input:invalid):hover:not(:has(>.field-text-input:disabled)):not(:focus-within) .field-text-label,body[data-ml-theme=dark] .field-text:not(:has(>.field-text-input:disabled)):has(>.field-text-input:invalid):hover:not(:has(>.field-text-input:disabled)):not(:focus-within) .field-text-icon-trailing,body[data-ml-theme=dark] .field-text:not(:has(>.field-text-input:disabled)):has(>.field-text-input:invalid):hover:not(:has(>.field-text-input:disabled)):not(:focus-within) .field-text-label{color:#f2b8b5}.field-text-support{margin:.25rem 1rem 0;color:#49454f;font-family:"Roboto Flex",roboto,system-ui,-apple-system,blinkmacsystemfont,"Segoe UI",helvetica,arial,ubuntu,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji";line-height:1rem;font-size:.75rem;font-weight:400;letter-spacing:.025rem}.field-text-support[aria-disabled=true]{color:rgba(28,27,31,.38)}.field-text-support[aria-invalid=true]{color:#b3261e}.ml-theme-dark .field-text-support,body[data-ml-theme=dark] .field-text-support{color:#cac4d0}.ml-theme-dark .field-text-support[aria-disabled=true],body[data-ml-theme=dark] .field-text-support[aria-disabled=true]{color:rgba(230,225,229,.38)}.ml-theme-dark .field-text-support[aria-invalid=true],body[data-ml-theme=dark] .field-text-support[aria-invalid=true]{color:#f2b8b5}.typography-headline-large,.typography-headline-medium,.typography-headline-small{font-family:var(--ml-font-sans-serif);font-size:2rem;line-height:2.5rem;letter-spacing:0;font-weight:400}.typography-headline-medium,.typography-headline-small{font-size:1.75rem;line-height:2.25rem}.typography-headline-small{font-size:1.5rem;line-height:2rem}.typography-body-large,.typography-title-small{font-family:var(--ml-font-sans-serif);font-size:.875rem;line-height:1.25rem;letter-spacing:.00625rem;font-weight:500}.typography-body-large{font-size:1rem;line-height:1.5rem;letter-spacing:.03125rem;font-weight:400}.m-0{margin:0!important}.m-1{margin:.25rem!important}.m-2{margin:.5rem!important}.m-3{margin:1rem!important}.m-4{margin:1.5rem!important}.m-5{margin:3rem!important}.m-auto{margin:auto!important}.mx-0{margin-right:0!important;margin-left:0!important}.mx-1{margin-right:.25rem!important;margin-left:.25rem!important}.mx-2{margin-right:.5rem!important;margin-left:.5rem!important}.mx-3{margin-right:1rem!important;margin-left:1rem!important}.mx-4{margin-right:1.5rem!important;margin-left:1.5rem!important}.mx-5{margin-right:3rem!important;margin-left:3rem!important}.mx-auto{margin-right:auto!important;margin-left:auto!important}.my-0{margin-top:0!important;margin-bottom:0!important}.my-1{margin-top:.25rem!important;margin-bottom:.25rem!important}.my-2{margin-top:.5rem!important;margin-bottom:.5rem!important}.my-3{margin-top:1rem!important;margin-bottom:1rem!important}.my-4{margin-top:1.5rem!important;margin-bottom:1.5rem!important}.my-5{margin-top:3rem!important;margin-bottom:3rem!important}.my-auto{margin-top:auto!important;margin-bottom:auto!important}.mt-0{margin-top:0!important}.mt-1{margin-top:.25rem!important}.mt-2{margin-top:.5rem!important}.mt-3{margin-top:1rem!important}.mt-4{margin-top:1.5rem!important}.mt-5{margin-top:3rem!important}.mt-auto{margin-top:auto!important}.me-0{margin-right:0!important}.me-1{margin-right:.25rem!important}.me-2{margin-right:.5rem!important}.me-3{margin-right:1rem!important}.me-4{margin-right:1.5rem!important}.me-5{margin-right:3rem!important}.me-auto{margin-right:auto!important}.mb-0{margin-bottom:0!important}.mb-1{margin-bottom:.25rem!important}.mb-2{margin-bottom:.5rem!important}.mb-3{margin-bottom:1rem!important}.mb-4{margin-bottom:1.5rem!important}.mb-5{margin-bottom:3rem!important}.mb-auto{margin-bottom:auto!important}.ms-0{margin-left:0!important}.ms-1{margin-left:.25rem!important}.ms-2{margin-left:.5rem!important}.ms-3{margin-left:1rem!important}.ms-4{margin-left:1.5rem!important}.ms-5{margin-left:3rem!important}.ms-auto{margin-left:auto!important}.p-0{padding:0!important}.p-1{padding:.25rem!important}.p-2{padding:.5rem!important}.p-3{padding:1rem!important}.p-4{padding:1.5rem!important}.p-5{padding:3rem!important}.px-0{padding-right:0!important;padding-left:0!important}.px-1{padding-right:.25rem!important;padding-left:.25rem!important}.px-2{padding-right:.5rem!important;padding-left:.5rem!important}.px-3{padding-right:1rem!important;padding-left:1rem!important}.px-4{padding-right:1.5rem!important;padding-left:1.5rem!important}.px-5{padding-right:3rem!important;padding-left:3rem!important}.py-0{padding-top:0!important;padding-bottom:0!important}.py-1{padding-top:.25rem!important;padding-bottom:.25rem!important}.py-2{padding-top:.5rem!important;padding-bottom:.5rem!important}.py-3{padding-top:1rem!important;padding-bottom:1rem!important}.py-4{padding-top:1.5rem!important;padding-bottom:1.5rem!important}.py-5{padding-top:3rem!important;padding-bottom:3rem!important}.pt-0{padding-top:0!important}.pt-1{padding-top:.25rem!important}.pt-2{padding-top:.5rem!important}.pt-3{padding-top:1rem!important}.pt-4{padding-top:1.5rem!important}.pt-5{padding-top:3rem!important}.pe-0{padding-right:0!important}.pe-1{padding-right:.25rem!important}.pe-2{padding-right:.5rem!important}.pe-3{padding-right:1rem!important}.pe-4{padding-right:1.5rem!important}.pe-5{padding-right:3rem!important}.pb-0{padding-bottom:0!important}.pb-1{padding-bottom:.25rem!important}.pb-2{padding-bottom:.5rem!important}.pb-3{padding-bottom:1rem!important}.pb-4{padding-bottom:1.5rem!important}.pb-5{padding-bottom:3rem!important}.ps-0{padding-left:0!important}.ps-1{padding-left:.25rem!important}.ps-2{padding-left:.5rem!important}.ps-3{padding-left:1rem!important}.ps-4{padding-left:1.5rem!important}.ps-5{padding-left:3rem!important}.gap-0{gap:0!important}.gap-1{gap:.25rem!important}.gap-2{gap:.5rem!important}.gap-3{gap:1rem!important}.gap-4{gap:1.5rem!important}.gap-5{gap:3rem!important}@media (min-width:576px){.m-sm-0{margin:0!important}.m-sm-1{margin:.25rem!important}.m-sm-2{margin:.5rem!important}.m-sm-3{margin:1rem!important}.m-sm-4{margin:1.5rem!important}.m-sm-5{margin:3rem!important}.m-sm-auto{margin:auto!important}.mx-sm-0{margin-right:0!important;margin-left:0!important}.mx-sm-1{margin-right:.25rem!important;margin-left:.25rem!important}.mx-sm-2{margin-right:.5rem!important;margin-left:.5rem!important}.mx-sm-3{margin-right:1rem!important;margin-left:1rem!important}.mx-sm-4{margin-right:1.5rem!important;margin-left:1.5rem!important}.mx-sm-5{margin-right:3rem!important;margin-left:3rem!important}.mx-sm-auto{margin-right:auto!important;margin-left:auto!important}.my-sm-0{margin-top:0!important;margin-bottom:0!important}.my-sm-1{margin-top:.25rem!important;margin-bottom:.25rem!important}.my-sm-2{margin-top:.5rem!important;margin-bottom:.5rem!important}.my-sm-3{margin-top:1rem!important;margin-bottom:1rem!important}.my-sm-4{margin-top:1.5rem!important;margin-bottom:1.5rem!important}.my-sm-5{margin-top:3rem!important;margin-bottom:3rem!important}.my-sm-auto{margin-top:auto!important;margin-bottom:auto!important}.mt-sm-0{margin-top:0!important}.mt-sm-1{margin-top:.25rem!important}.mt-sm-2{margin-top:.5rem!important}.mt-sm-3{margin-top:1rem!important}.mt-sm-4{margin-top:1.5rem!important}.mt-sm-5{margin-top:3rem!important}.mt-sm-auto{margin-top:auto!important}.me-sm-0{margin-right:0!important}.me-sm-1{margin-right:.25rem!important}.me-sm-2{margin-right:.5rem!important}.me-sm-3{margin-right:1rem!important}.me-sm-4{margin-right:1.5rem!important}.me-sm-5{margin-right:3rem!important}.me-sm-auto{margin-right:auto!important}.mb-sm-0{margin-bottom:0!important}.mb-sm-1{margin-bottom:.25rem!important}.mb-sm-2{margin-bottom:.5rem!important}.mb-sm-3{margin-bottom:1rem!important}.mb-sm-4{margin-bottom:1.5rem!important}.mb-sm-5{margin-bottom:3rem!important}.mb-sm-auto{margin-bottom:auto!important}.ms-sm-0{margin-left:0!important}.ms-sm-1{margin-left:.25rem!important}.ms-sm-2{margin-left:.5rem!important}.ms-sm-3{margin-left:1rem!important}.ms-sm-4{margin-left:1.5rem!important}.ms-sm-5{margin-left:3rem!important}.ms-sm-auto{margin-left:auto!important}.p-sm-0{padding:0!important}.p-sm-1{padding:.25rem!important}.p-sm-2{padding:.5rem!important}.p-sm-3{padding:1rem!important}.p-sm-4{padding:1.5rem!important}.p-sm-5{padding:3rem!important}.px-sm-0{padding-right:0!important;padding-left:0!important}.px-sm-1{padding-right:.25rem!important;padding-left:.25rem!important}.px-sm-2{padding-right:.5rem!important;padding-left:.5rem!important}.px-sm-3{padding-right:1rem!important;padding-left:1rem!important}.px-sm-4{padding-right:1.5rem!important;padding-left:1.5rem!important}.px-sm-5{padding-right:3rem!important;padding-left:3rem!important}.py-sm-0{padding-top:0!important;padding-bottom:0!important}.py-sm-1{padding-top:.25rem!important;padding-bottom:.25rem!important}.py-sm-2{padding-top:.5rem!important;padding-bottom:.5rem!important}.py-sm-3{padding-top:1rem!important;padding-bottom:1rem!important}.py-sm-4{padding-top:1.5rem!important;padding-bottom:1.5rem!important}.py-sm-5{padding-top:3rem!important;padding-bottom:3rem!important}.pt-sm-0{padding-top:0!important}.pt-sm-1{padding-top:.25rem!important}.pt-sm-2{padding-top:.5rem!important}.pt-sm-3{padding-top:1rem!important}.pt-sm-4{padding-top:1.5rem!important}.pt-sm-5{padding-top:3rem!important}.pe-sm-0{padding-right:0!important}.pe-sm-1{padding-right:.25rem!important}.pe-sm-2{padding-right:.5rem!important}.pe-sm-3{padding-right:1rem!important}.pe-sm-4{padding-right:1.5rem!important}.pe-sm-5{padding-right:3rem!important}.pb-sm-0{padding-bottom:0!important}.pb-sm-1{padding-bottom:.25rem!important}.pb-sm-2{padding-bottom:.5rem!important}.pb-sm-3{padding-bottom:1rem!important}.pb-sm-4{padding-bottom:1.5rem!important}.pb-sm-5{padding-bottom:3rem!important}.ps-sm-0{padding-left:0!important}.ps-sm-1{padding-left:.25rem!important}.ps-sm-2{padding-left:.5rem!important}.ps-sm-3{padding-left:1rem!important}.ps-sm-4{padding-left:1.5rem!important}.ps-sm-5{padding-left:3rem!important}.gap-sm-0{gap:0!important}.gap-sm-1{gap:.25rem!important}.gap-sm-2{gap:.5rem!important}.gap-sm-3{gap:1rem!important}.gap-sm-4{gap:1.5rem!important}.gap-sm-5{gap:3rem!important}}@media (min-width:768px){.m-md-0{margin:0!important}.m-md-1{margin:.25rem!important}.m-md-2{margin:.5rem!important}.m-md-3{margin:1rem!important}.m-md-4{margin:1.5rem!important}.m-md-5{margin:3rem!important}.m-md-auto{margin:auto!important}.mx-md-0{margin-right:0!important;margin-left:0!important}.mx-md-1{margin-right:.25rem!important;margin-left:.25rem!important}.mx-md-2{margin-right:.5rem!important;margin-left:.5rem!important}.mx-md-3{margin-right:1rem!important;margin-left:1rem!important}.mx-md-4{margin-right:1.5rem!important;margin-left:1.5rem!important}.mx-md-5{margin-right:3rem!important;margin-left:3rem!important}.mx-md-auto{margin-right:auto!important;margin-left:auto!important}.my-md-0{margin-top:0!important;margin-bottom:0!important}.my-md-1{margin-top:.25rem!important;margin-bottom:.25rem!important}.my-md-2{margin-top:.5rem!important;margin-bottom:.5rem!important}.my-md-3{margin-top:1rem!important;margin-bottom:1rem!important}.my-md-4{margin-top:1.5rem!important;margin-bottom:1.5rem!important}.my-md-5{margin-top:3rem!important;margin-bottom:3rem!important}.my-md-auto{margin-top:auto!important;margin-bottom:auto!important}.mt-md-0{margin-top:0!important}.mt-md-1{margin-top:.25rem!important}.mt-md-2{margin-top:.5rem!important}.mt-md-3{margin-top:1rem!important}.mt-md-4{margin-top:1.5rem!important}.mt-md-5{margin-top:3rem!important}.mt-md-auto{margin-top:auto!important}.me-md-0{margin-right:0!important}.me-md-1{margin-right:.25rem!important}.me-md-2{margin-right:.5rem!important}.me-md-3{margin-right:1rem!important}.me-md-4{margin-right:1.5rem!important}.me-md-5{margin-right:3rem!important}.me-md-auto{margin-right:auto!important}.mb-md-0{margin-bottom:0!important}.mb-md-1{margin-bottom:.25rem!important}.mb-md-2{margin-bottom:.5rem!important}.mb-md-3{margin-bottom:1rem!important}.mb-md-4{margin-bottom:1.5rem!important}.mb-md-5{margin-bottom:3rem!important}.mb-md-auto{margin-bottom:auto!important}.ms-md-0{margin-left:0!important}.ms-md-1{margin-left:.25rem!important}.ms-md-2{margin-left:.5rem!important}.ms-md-3{margin-left:1rem!important}.ms-md-4{margin-left:1.5rem!important}.ms-md-5{margin-left:3rem!important}.ms-md-auto{margin-left:auto!important}.p-md-0{padding:0!important}.p-md-1{padding:.25rem!important}.p-md-2{padding:.5rem!important}.p-md-3{padding:1rem!important}.p-md-4{padding:1.5rem!important}.p-md-5{padding:3rem!important}.px-md-0{padding-right:0!important;padding-left:0!important}.px-md-1{padding-right:.25rem!important;padding-left:.25rem!important}.px-md-2{padding-right:.5rem!important;padding-left:.5rem!important}.px-md-3{padding-right:1rem!important;padding-left:1rem!important}.px-md-4{padding-right:1.5rem!important;padding-left:1.5rem!important}.px-md-5{padding-right:3rem!important;padding-left:3rem!important}.py-md-0{padding-top:0!important;padding-bottom:0!important}.py-md-1{padding-top:.25rem!important;padding-bottom:.25rem!important}.py-md-2{padding-top:.5rem!important;padding-bottom:.5rem!important}.py-md-3{padding-top:1rem!important;padding-bottom:1rem!important}.py-md-4{padding-top:1.5rem!important;padding-bottom:1.5rem!important}.py-md-5{padding-top:3rem!important;padding-bottom:3rem!important}.pt-md-0{padding-top:0!important}.pt-md-1{padding-top:.25rem!important}.pt-md-2{padding-top:.5rem!important}.pt-md-3{padding-top:1rem!important}.pt-md-4{padding-top:1.5rem!important}.pt-md-5{padding-top:3rem!important}.pe-md-0{padding-right:0!important}.pe-md-1{padding-right:.25rem!important}.pe-md-2{padding-right:.5rem!important}.pe-md-3{padding-right:1rem!important}.pe-md-4{padding-right:1.5rem!important}.pe-md-5{padding-right:3rem!important}.pb-md-0{padding-bottom:0!important}.pb-md-1{padding-bottom:.25rem!important}.pb-md-2{padding-bottom:.5rem!important}.pb-md-3{padding-bottom:1rem!important}.pb-md-4{padding-bottom:1.5rem!important}.pb-md-5{padding-bottom:3rem!important}.ps-md-0{padding-left:0!important}.ps-md-1{padding-left:.25rem!important}.ps-md-2{padding-left:.5rem!important}.ps-md-3{padding-left:1rem!important}.ps-md-4{padding-left:1.5rem!important}.ps-md-5{padding-left:3rem!important}.gap-md-0{gap:0!important}.gap-md-1{gap:.25rem!important}.gap-md-2{gap:.5rem!important}.gap-md-3{gap:1rem!important}.gap-md-4{gap:1.5rem!important}.gap-md-5{gap:3rem!important}}@media (min-width:992px){.m-lg-0{margin:0!important}.m-lg-1{margin:.25rem!important}.m-lg-2{margin:.5rem!important}.m-lg-3{margin:1rem!important}.m-lg-4{margin:1.5rem!important}.m-lg-5{margin:3rem!important}.m-lg-auto{margin:auto!important}.mx-lg-0{margin-right:0!important;margin-left:0!important}.mx-lg-1{margin-right:.25rem!important;margin-left:.25rem!important}.mx-lg-2{margin-right:.5rem!important;margin-left:.5rem!important}.mx-lg-3{margin-right:1rem!important;margin-left:1rem!important}.mx-lg-4{margin-right:1.5rem!important;margin-left:1.5rem!important}.mx-lg-5{margin-right:3rem!important;margin-left:3rem!important}.mx-lg-auto{margin-right:auto!important;margin-left:auto!important}.my-lg-0{margin-top:0!important;margin-bottom:0!important}.my-lg-1{margin-top:.25rem!important;margin-bottom:.25rem!important}.my-lg-2{margin-top:.5rem!important;margin-bottom:.5rem!important}.my-lg-3{margin-top:1rem!important;margin-bottom:1rem!important}.my-lg-4{margin-top:1.5rem!important;margin-bottom:1.5rem!important}.my-lg-5{margin-top:3rem!important;margin-bottom:3rem!important}.my-lg-auto{margin-top:auto!important;margin-bottom:auto!important}.mt-lg-0{margin-top:0!important}.mt-lg-1{margin-top:.25rem!important}.mt-lg-2{margin-top:.5rem!important}.mt-lg-3{margin-top:1rem!important}.mt-lg-4{margin-top:1.5rem!important}.mt-lg-5{margin-top:3rem!important}.mt-lg-auto{margin-top:auto!important}.me-lg-0{margin-right:0!important}.me-lg-1{margin-right:.25rem!important}.me-lg-2{margin-right:.5rem!important}.me-lg-3{margin-right:1rem!important}.me-lg-4{margin-right:1.5rem!important}.me-lg-5{margin-right:3rem!important}.me-lg-auto{margin-right:auto!important}.mb-lg-0{margin-bottom:0!important}.mb-lg-1{margin-bottom:.25rem!important}.mb-lg-2{margin-bottom:.5rem!important}.mb-lg-3{margin-bottom:1rem!important}.mb-lg-4{margin-bottom:1.5rem!important}.mb-lg-5{margin-bottom:3rem!important}.mb-lg-auto{margin-bottom:auto!important}.ms-lg-0{margin-left:0!important}.ms-lg-1{margin-left:.25rem!important}.ms-lg-2{margin-left:.5rem!important}.ms-lg-3{margin-left:1rem!important}.ms-lg-4{margin-left:1.5rem!important}.ms-lg-5{margin-left:3rem!important}.ms-lg-auto{margin-left:auto!important}.p-lg-0{padding:0!important}.p-lg-1{padding:.25rem!important}.p-lg-2{padding:.5rem!important}.p-lg-3{padding:1rem!important}.p-lg-4{padding:1.5rem!important}.p-lg-5{padding:3rem!important}.px-lg-0{padding-right:0!important;padding-left:0!important}.px-lg-1{padding-right:.25rem!important;padding-left:.25rem!important}.px-lg-2{padding-right:.5rem!important;padding-left:.5rem!important}.px-lg-3{padding-right:1rem!important;padding-left:1rem!important}.px-lg-4{padding-right:1.5rem!important;padding-left:1.5rem!important}.px-lg-5{padding-right:3rem!important;padding-left:3rem!important}.py-lg-0{padding-top:0!important;padding-bottom:0!important}.py-lg-1{padding-top:.25rem!important;padding-bottom:.25rem!important}.py-lg-2{padding-top:.5rem!important;padding-bottom:.5rem!important}.py-lg-3{padding-top:1rem!important;padding-bottom:1rem!important}.py-lg-4{padding-top:1.5rem!important;padding-bottom:1.5rem!important}.py-lg-5{padding-top:3rem!important;padding-bottom:3rem!important}.pt-lg-0{padding-top:0!important}.pt-lg-1{padding-top:.25rem!important}.pt-lg-2{padding-top:.5rem!important}.pt-lg-3{padding-top:1rem!important}.pt-lg-4{padding-top:1.5rem!important}.pt-lg-5{padding-top:3rem!important}.pe-lg-0{padding-right:0!important}.pe-lg-1{padding-right:.25rem!important}.pe-lg-2{padding-right:.5rem!important}.pe-lg-3{padding-right:1rem!important}.pe-lg-4{padding-right:1.5rem!important}.pe-lg-5{padding-right:3rem!important}.pb-lg-0{padding-bottom:0!important}.pb-lg-1{padding-bottom:.25rem!important}.pb-lg-2{padding-bottom:.5rem!important}.pb-lg-3{padding-bottom:1rem!important}.pb-lg-4{padding-bottom:1.5rem!important}.pb-lg-5{padding-bottom:3rem!important}.ps-lg-0{padding-left:0!important}.ps-lg-1{padding-left:.25rem!important}.ps-lg-2{padding-left:.5rem!important}.ps-lg-3{padding-left:1rem!important}.ps-lg-4{padding-left:1.5rem!important}.ps-lg-5{padding-left:3rem!important}.gap-lg-0{gap:0!important}.gap-lg-1{gap:.25rem!important}.gap-lg-2{gap:.5rem!important}.gap-lg-3{gap:1rem!important}.gap-lg-4{gap:1.5rem!important}.gap-lg-5{gap:3rem!important}}@media (min-width:1200px){.m-xl-0{margin:0!important}.m-xl-1{margin:.25rem!important}.m-xl-2{margin:.5rem!important}.m-xl-3{margin:1rem!important}.m-xl-4{margin:1.5rem!important}.m-xl-5{margin:3rem!important}.m-xl-auto{margin:auto!important}.mx-xl-0{margin-right:0!important;margin-left:0!important}.mx-xl-1{margin-right:.25rem!important;margin-left:.25rem!important}.mx-xl-2{margin-right:.5rem!important;margin-left:.5rem!important}.mx-xl-3{margin-right:1rem!important;margin-left:1rem!important}.mx-xl-4{margin-right:1.5rem!important;margin-left:1.5rem!important}.mx-xl-5{margin-right:3rem!important;margin-left:3rem!important}.mx-xl-auto{margin-right:auto!important;margin-left:auto!important}.my-xl-0{margin-top:0!important;margin-bottom:0!important}.my-xl-1{margin-top:.25rem!important;margin-bottom:.25rem!important}.my-xl-2{margin-top:.5rem!important;margin-bottom:.5rem!important}.my-xl-3{margin-top:1rem!important;margin-bottom:1rem!important}.my-xl-4{margin-top:1.5rem!important;margin-bottom:1.5rem!important}.my-xl-5{margin-top:3rem!important;margin-bottom:3rem!important}.my-xl-auto{margin-top:auto!important;margin-bottom:auto!important}.mt-xl-0{margin-top:0!important}.mt-xl-1{margin-top:.25rem!important}.mt-xl-2{margin-top:.5rem!important}.mt-xl-3{margin-top:1rem!important}.mt-xl-4{margin-top:1.5rem!important}.mt-xl-5{margin-top:3rem!important}.mt-xl-auto{margin-top:auto!important}.me-xl-0{margin-right:0!important}.me-xl-1{margin-right:.25rem!important}.me-xl-2{margin-right:.5rem!important}.me-xl-3{margin-right:1rem!important}.me-xl-4{margin-right:1.5rem!important}.me-xl-5{margin-right:3rem!important}.me-xl-auto{margin-right:auto!important}.mb-xl-0{margin-bottom:0!important}.mb-xl-1{margin-bottom:.25rem!important}.mb-xl-2{margin-bottom:.5rem!important}.mb-xl-3{margin-bottom:1rem!important}.mb-xl-4{margin-bottom:1.5rem!important}.mb-xl-5{margin-bottom:3rem!important}.mb-xl-auto{margin-bottom:auto!important}.ms-xl-0{margin-left:0!important}.ms-xl-1{margin-left:.25rem!important}.ms-xl-2{margin-left:.5rem!important}.ms-xl-3{margin-left:1rem!important}.ms-xl-4{margin-left:1.5rem!important}.ms-xl-5{margin-left:3rem!important}.ms-xl-auto{margin-left:auto!important}.p-xl-0{padding:0!important}.p-xl-1{padding:.25rem!important}.p-xl-2{padding:.5rem!important}.p-xl-3{padding:1rem!important}.p-xl-4{padding:1.5rem!important}.p-xl-5{padding:3rem!important}.px-xl-0{padding-right:0!important;padding-left:0!important}.px-xl-1{padding-right:.25rem!important;padding-left:.25rem!important}.px-xl-2{padding-right:.5rem!important;padding-left:.5rem!important}.px-xl-3{padding-right:1rem!important;padding-left:1rem!important}.px-xl-4{padding-right:1.5rem!important;padding-left:1.5rem!important}.px-xl-5{padding-right:3rem!important;padding-left:3rem!important}.py-xl-0{padding-top:0!important;padding-bottom:0!important}.py-xl-1{padding-top:.25rem!important;padding-bottom:.25rem!important}.py-xl-2{padding-top:.5rem!important;padding-bottom:.5rem!important}.py-xl-3{padding-top:1rem!important;padding-bottom:1rem!important}.py-xl-4{padding-top:1.5rem!important;padding-bottom:1.5rem!important}.py-xl-5{padding-top:3rem!important;padding-bottom:3rem!important}.pt-xl-0{padding-top:0!important}.pt-xl-1{padding-top:.25rem!important}.pt-xl-2{padding-top:.5rem!important}.pt-xl-3{padding-top:1rem!important}.pt-xl-4{padding-top:1.5rem!important}.pt-xl-5{padding-top:3rem!important}.pe-xl-0{padding-right:0!important}.pe-xl-1{padding-right:.25rem!important}.pe-xl-2{padding-right:.5rem!important}.pe-xl-3{padding-right:1rem!important}.pe-xl-4{padding-right:1.5rem!important}.pe-xl-5{padding-right:3rem!important}.pb-xl-0{padding-bottom:0!important}.pb-xl-1{padding-bottom:.25rem!important}.pb-xl-2{padding-bottom:.5rem!important}.pb-xl-3{padding-bottom:1rem!important}.pb-xl-4{padding-bottom:1.5rem!important}.pb-xl-5{padding-bottom:3rem!important}.ps-xl-0{padding-left:0!important}.ps-xl-1{padding-left:.25rem!important}.ps-xl-2{padding-left:.5rem!important}.ps-xl-3{padding-left:1rem!important}.ps-xl-4{padding-left:1.5rem!important}.ps-xl-5{padding-left:3rem!important}.gap-xl-0{gap:0!important}.gap-xl-1{gap:.25rem!important}.gap-xl-2{gap:.5rem!important}.gap-xl-3{gap:1rem!important}.gap-xl-4{gap:1.5rem!important}.gap-xl-5{gap:3rem!important}}@media (min-width:1400px){.m-xxl-0{margin:0!important}.m-xxl-1{margin:.25rem!important}.m-xxl-2{margin:.5rem!important}.m-xxl-3{margin:1rem!important}.m-xxl-4{margin:1.5rem!important}.m-xxl-5{margin:3rem!important}.m-xxl-auto{margin:auto!important}.mx-xxl-0{margin-right:0!important;margin-left:0!important}.mx-xxl-1{margin-right:.25rem!important;margin-left:.25rem!important}.mx-xxl-2{margin-right:.5rem!important;margin-left:.5rem!important}.mx-xxl-3{margin-right:1rem!important;margin-left:1rem!important}.mx-xxl-4{margin-right:1.5rem!important;margin-left:1.5rem!important}.mx-xxl-5{margin-right:3rem!important;margin-left:3rem!important}.mx-xxl-auto{margin-right:auto!important;margin-left:auto!important}.my-xxl-0{margin-top:0!important;margin-bottom:0!important}.my-xxl-1{margin-top:.25rem!important;margin-bottom:.25rem!important}.my-xxl-2{margin-top:.5rem!important;margin-bottom:.5rem!important}.my-xxl-3{margin-top:1rem!important;margin-bottom:1rem!important}.my-xxl-4{margin-top:1.5rem!important;margin-bottom:1.5rem!important}.my-xxl-5{margin-top:3rem!important;margin-bottom:3rem!important}.my-xxl-auto{margin-top:auto!important;margin-bottom:auto!important}.mt-xxl-0{margin-top:0!important}.mt-xxl-1{margin-top:.25rem!important}.mt-xxl-2{margin-top:.5rem!important}.mt-xxl-3{margin-top:1rem!important}.mt-xxl-4{margin-top:1.5rem!important}.mt-xxl-5{margin-top:3rem!important}.mt-xxl-auto{margin-top:auto!important}.me-xxl-0{margin-right:0!important}.me-xxl-1{margin-right:.25rem!important}.me-xxl-2{margin-right:.5rem!important}.me-xxl-3{margin-right:1rem!important}.me-xxl-4{margin-right:1.5rem!important}.me-xxl-5{margin-right:3rem!important}.me-xxl-auto{margin-right:auto!important}.mb-xxl-0{margin-bottom:0!important}.mb-xxl-1{margin-bottom:.25rem!important}.mb-xxl-2{margin-bottom:.5rem!important}.mb-xxl-3{margin-bottom:1rem!important}.mb-xxl-4{margin-bottom:1.5rem!important}.mb-xxl-5{margin-bottom:3rem!important}.mb-xxl-auto{margin-bottom:auto!important}.ms-xxl-0{margin-left:0!important}.ms-xxl-1{margin-left:.25rem!important}.ms-xxl-2{margin-left:.5rem!important}.ms-xxl-3{margin-left:1rem!important}.ms-xxl-4{margin-left:1.5rem!important}.ms-xxl-5{margin-left:3rem!important}.ms-xxl-auto{margin-left:auto!important}.p-xxl-0{padding:0!important}.p-xxl-1{padding:.25rem!important}.p-xxl-2{padding:.5rem!important}.p-xxl-3{padding:1rem!important}.p-xxl-4{padding:1.5rem!important}.p-xxl-5{padding:3rem!important}.px-xxl-0{padding-right:0!important;padding-left:0!important}.px-xxl-1{padding-right:.25rem!important;padding-left:.25rem!important}.px-xxl-2{padding-right:.5rem!important;padding-left:.5rem!important}.px-xxl-3{padding-right:1rem!important;padding-left:1rem!important}.px-xxl-4{padding-right:1.5rem!important;padding-left:1.5rem!important}.px-xxl-5{padding-right:3rem!important;padding-left:3rem!important}.py-xxl-0{padding-top:0!important;padding-bottom:0!important}.py-xxl-1{padding-top:.25rem!important;padding-bottom:.25rem!important}.py-xxl-2{padding-top:.5rem!important;padding-bottom:.5rem!important}.py-xxl-3{padding-top:1rem!important;padding-bottom:1rem!important}.py-xxl-4{padding-top:1.5rem!important;padding-bottom:1.5rem!important}.py-xxl-5{padding-top:3rem!important;padding-bottom:3rem!important}.pt-xxl-0{padding-top:0!important}.pt-xxl-1{padding-top:.25rem!important}.pt-xxl-2{padding-top:.5rem!important}.pt-xxl-3{padding-top:1rem!important}.pt-xxl-4{padding-top:1.5rem!important}.pt-xxl-5{padding-top:3rem!important}.pe-xxl-0{padding-right:0!important}.pe-xxl-1{padding-right:.25rem!important}.pe-xxl-2{padding-right:.5rem!important}.pe-xxl-3{padding-right:1rem!important}.pe-xxl-4{padding-right:1.5rem!important}.pe-xxl-5{padding-right:3rem!important}.pb-xxl-0{padding-bottom:0!important}.pb-xxl-1{padding-bottom:.25rem!important}.pb-xxl-2{padding-bottom:.5rem!important}.pb-xxl-3{padding-bottom:1rem!important}.pb-xxl-4{padding-bottom:1.5rem!important}.pb-xxl-5{padding-bottom:3rem!important}.ps-xxl-0{padding-left:0!important}.ps-xxl-1{padding-left:.25rem!important}.ps-xxl-2{padding-left:.5rem!important}.ps-xxl-3{padding-left:1rem!important}.ps-xxl-4{padding-left:1.5rem!important}.ps-xxl-5{padding-left:3rem!important}.gap-xxl-0{gap:0!important}.gap-xxl-1{gap:.25rem!important}.gap-xxl-2{gap:.5rem!important}.gap-xxl-3{gap:1rem!important}.gap-xxl-4{gap:1.5rem!important}.gap-xxl-5{gap:3rem!important}} \ No newline at end of file diff --git a/package.json b/package.json index e0d232e..0f676c4 100644 --- a/package.json +++ b/package.json @@ -40,7 +40,7 @@ "site-bench": "DEBUG=Eleventy:Benchmark* npx @11ty/eleventy", "site-serve": "npx @11ty/eleventy --serve --incremental", "watch": "npm-run-all --parallel watch-*", - "watch-css-main": "nodemon --watch scss/ --ext scss --exec \"npm-run-all css-lint-stylelint css-compile\"", + "watch-css-main": "nodemon --watch scss/ --ext scss --exec \"npm-run-all css-lint-stylelint css-compile css-minify\"", "watch-site-main": "npx @11ty/eleventy --watch --incremental" }, "lint-staged": { diff --git a/scss/_fields.scss b/scss/_fields.scss deleted file mode 100644 index 3f98b5a..0000000 --- a/scss/_fields.scss +++ /dev/null @@ -1,410 +0,0 @@ -// This Source Code Form is subject to the terms of the Mozilla Public -// License, v. 2.0. If a copy of the MPL was not distributed with this -// file, You can obtain one at https://mozilla.org/MPL/2.0/. - -@use 'sass:color'; -@use 'functions'; -@use 'variables'; -@use 'tokens/sys/themes/light'; -@use 'tokens/sys/themes/dark'; -@use 'tokens/sys/shape'; -@use 'tokens/sys/typescale'; -@use 'tokens/sys/motion'; - -/* stylelint-disable no-descending-specificity -- Extremely convoluted rule for advanced styling. */ -.field-text { - position: relative; - height: 3.5rem; - box-sizing: border-box; - transition-property: background-color; - transition-duration: motion.$md-sys-motion-transition-duration; - transition-timing-function: motion.$md-sys-motion-easing-standard-curve; - - .field-text-input { - height: 100%; - width: 100%; - background: none; - box-sizing: border-box; - border: 0; - color: light.$md-sys-color-on-surface; - caret-color: light.$md-sys-color-primary; - font-family: typescale.$md-sys-typescale-body-large-font; - line-height: typescale.$md-sys-typescale-body-large-line-height; - font-size: typescale.$md-sys-typescale-body-large-size; - font-weight: typescale.$md-sys-typescale-body-large-weight; - letter-spacing: typescale.$md-sys-typescale-body-large-tracking; - - &:focus { - outline: none; - } - - &::placeholder { - color: light.$md-sys-color-on-surface-variant; - } - } - - &.field-text-filled { - background: light.$md-sys-color-surface-variant; - border-radius: shape.$md-sys-shape-corner-extra-small-top; - - .field-text-input { - padding: 1.25rem 1rem 0.5rem; - } - } - - &.field-text-outlined { - .field-text-input { - padding: 0 1rem; - } - - .field-text-label { - background: inherit; - z-index: 1; - } - } - - &.field-text-filled::after { - content: ' '; - position: absolute; - left: 0; - bottom: 0; - width: 100%; - border-bottom: 0.0625rem solid light.$md-sys-color-on-surface-variant; - transition-property: border-color, border-width; - transition-duration: motion.$md-sys-motion-transition-duration; - transition-timing-function: motion.$md-sys-motion-easing-standard-curve; - user-select: none; - pointer-events: none; - } - - &.field-text-outlined::after { - content: ' '; - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - border: 0.0625rem solid light.$md-sys-color-outline; - border-radius: shape.$md-sys-shape-corner-extra-small; - transition-property: border-color, border-width; - transition-duration: motion.$md-sys-motion-transition-duration; - transition-timing-function: motion.$md-sys-motion-easing-standard-curve; - user-select: none; - pointer-events: none; - box-sizing: border-box; - } - - .field-text-icon-leading { - position: absolute; - top: 50%; - left: 0.75rem; - transform: translateY(-50%); - user-select: none; - pointer-events: none; - color: light.$md-sys-color-on-surface-variant; - font-size: 1.5rem; - line-height: 0; - } - - .field-text-label { - position: absolute; - top: 50%; - left: 1rem; - transform: translateY(-50%); - user-select: none; - pointer-events: none; - margin-right: 1rem; - color: light.$md-sys-color-on-surface-variant; - font-family: typescale.$md-sys-typescale-body-large-font; - line-height: typescale.$md-sys-typescale-body-large-line-height; - font-size: typescale.$md-sys-typescale-body-large-size; - font-weight: typescale.$md-sys-typescale-body-large-weight; - letter-spacing: typescale.$md-sys-typescale-body-large-tracking; - transition-property: color, transform, top, font-size, line-height, left, padding; - transition-duration: motion.$md-sys-motion-transition-duration; - transition-timing-function: motion.$md-sys-motion-easing-standard-curve; - } - - .field-text-icon-trailing { - position: absolute; - top: 50%; - right: 0.75rem; - transform: translateY(-50%); - user-select: none; - pointer-events: none; - color: light.$md-sys-color-on-surface-variant; - font-size: 1.5rem; - line-height: 0; - transition-property: color; - transition-duration: motion.$md-sys-motion-transition-duration; - transition-timing-function: motion.$md-sys-motion-easing-standard-curve; - } - - &:has(> .field-text-icon-leading) { - .field-text-input { - padding-left: 3.25rem; - } - - &.field-text-filled .field-text-label { - left: 3.25rem; - } - } - - &:has(> .field-text-icon-trailing) { - .field-text-input { - padding-right: 3.25rem; - } - - .field-text-label { - margin-right: 3.25rem; - } - } - - // Webkit autofill hide hack - // TODO: Support autofill color. - .field-text-input:-webkit-autofill, - .field-text-input:-webkit-autofill:focus { - transition: background-color 2147483647s 0s, color 2147483647s 0s !important; - } - - // Disabled - &:has(> .field-text-input:disabled) { - &.field-text-filled { - background: color.scale(light.$md-sys-color-on-surface, $alpha: -96%); - } - - &.field-text-filled::after { - border-color: color.scale(light.$md-sys-color-on-surface, $alpha: -62%); - } - - .field-text-label, - .field-text-input, - .field-text-icon-leading, - .field-text-icon-trailing { - color: color.scale(light.$md-sys-color-on-surface, $alpha: -62%); - } - } - - // Field input not empty - &:has(> .field-text-input:not(:placeholder-shown)), - &:focus-within:not(:has(> .field-text-input:disabled)) { - &.field-text-filled .field-text-label { - top: 0.5rem; - } - - &.field-text-outlined .field-text-label { - top: -0.475rem; - padding: 0 0.25rem; - } - - .field-text-label { - transform: translateY(0); - line-height: typescale.$md-sys-typescale-body-small-line-height; - font-size: typescale.$md-sys-typescale-body-small-size; - } - } - - &:has(> .field-text-input:placeholder-shown):has(> .field-text-input:not(:focus)) { - &:has(> .field-text-icon-leading) { - &.field-text-outlined .field-text-label { - left: 3.25rem; - } - } - } - - // Focused - &:focus-within:not(:has(> .field-text-input:disabled)) { - &.field-text-filled::after { - border-bottom: 0.125rem solid light.$md-sys-color-primary; - } - - &.field-text-outlined::after { - border-width: 0.125rem; - border-color: light.$md-sys-color-primary; - } - - .field-text-label { - color: light.$md-sys-color-primary; - } - } - - // Hovered - &:hover:not(:has(> .field-text-input:disabled), :focus-within) { - &.field-text-filled { - background: functions.state-layer(light.$md-sys-color-surface-variant, light.$md-sys-color-on-surface, 'hover'); - } - - &.field-text-outlined { - &::after { - border-color: light.$md-sys-color-primary; - } - - .field-text-label { - color: light.$md-sys-color-on-surface; - } - } - } - - // Error - &:not(:has(> .field-text-input:disabled)):has(> .field-text-input:invalid) { - &::after { - border-color: light.$md-sys-color-error; - } - - .field-text-label, - .field-text-icon-trailing { - color: light.$md-sys-color-error; - } - - .field-text-input { - caret-color: light.$md-sys-color-error; - } - - // Error hover - &:hover:not(:has(> .field-text-input:disabled), :focus-within) { - &.field-text-filled { - background: functions.state-layer(light.$md-sys-color-surface-variant, light.$md-sys-color-on-surface, 'hover'); - } - - &.field-text-filled::after { - border-color: light.$md-sys-color-on-error-container; - } - - .field-text-label, - .field-text-icon-trailing { - color: light.$md-sys-color-on-error-container; - } - } - } - - // Dark theme - @at-root body[data-#{variables.$prefix}theme='dark'] &, - .#{variables.$prefix}theme-dark & { - &.field-text-filled { - background: dark.$md-sys-color-surface-variant; - } - - &.field-text-outlined { - border-color: dark.$md-sys-color-outline; - } - - &.field-text-filled::after { - border-color: dark.$md-sys-color-on-surface-variant; - } - - .field-text-input { - color: dark.$md-sys-color-on-surface; - caret-color: dark.$md-sys-color-primary; - - &::placeholder { - color: dark.$md-sys-color-on-surface-variant; - } - } - - .field-text-icon-leading { - color: dark.$md-sys-color-on-surface-variant; - } - - .field-text-label { - color: dark.$md-sys-color-on-surface-variant; - } - - .field-text-icon-trailing { - color: dark.$md-sys-color-on-surface-variant; - } - - &:has(> .field-text-input:disabled) { - &.field-text-filled { - background: color.scale(dark.$md-sys-color-on-surface, $alpha: -96%); - } - - &.field-text-filled::after { - border-color: color.scale(dark.$md-sys-color-on-surface, $alpha: -62%); - } - - .field-text-label, - .field-text-input, - .field-text-icon-leading, - .field-text-icon-trailing { - color: color.scale(dark.$md-sys-color-on-surface, $alpha: -62%); - } - } - - &:focus-within:not(:has(> .field-text-input:disabled)) { - &.field-text-filled::after { - border-color: dark.$md-sys-color-primary; - } - - .field-text-label { - color: dark.$md-sys-color-primary; - } - } - - &:hover:not(:has(> .field-text-input:disabled), :focus-within) { - &.field-text-filled { - background: functions.state-layer(dark.$md-sys-color-surface-variant, dark.$md-sys-color-on-surface, 'hover'); - } - } - - &:not(:has(> .field-text-input:disabled)):has(> .field-text-input:invalid) { - &.field-text-filled::after { - border-color: dark.$md-sys-color-error; - } - - .field-text-label, - .field-text-icon-trailing { - color: dark.$md-sys-color-error; - } - - .field-text-input { - caret-color: dark.$md-sys-color-error; - } - - &:hover:not(:has(> .field-text-input:disabled), :focus-within) { - &.field-text-filled { - background: functions.state-layer(dark.$md-sys-color-surface-variant, dark.$md-sys-color-on-surface, 'hover'); - } - - &.field-text-filled::after { - border-color: dark.$md-sys-color-on-error-container; - } - - .field-text-label, - .field-text-icon-trailing { - color: dark.$md-sys-color-on-error-container; - } - } - } - } -} - -.field-text-support { - margin: 0.25rem 1rem 0; - color: light.$md-sys-color-on-surface-variant; - font-family: typescale.$md-sys-typescale-body-small-font; - line-height: typescale.$md-sys-typescale-body-small-line-height; - font-size: typescale.$md-sys-typescale-body-small-size; - font-weight: typescale.$md-sys-typescale-body-small-weight; - letter-spacing: typescale.$md-sys-typescale-body-small-tracking; - - &[aria-disabled='true'] { - color: color.scale(light.$md-sys-color-on-surface, $alpha: -62%); - } - - &[aria-invalid='true'] { - color: light.$md-sys-color-error; - } - - @at-root body[data-#{variables.$prefix}theme='dark'] &, - .#{variables.$prefix}theme-dark & { - color: dark.$md-sys-color-on-surface-variant; - - &[aria-disabled='true'] { - color: color.scale(dark.$md-sys-color-on-surface, $alpha: -62%); - } - - &[aria-invalid='true'] { - color: dark.$md-sys-color-error; - } - } -} diff --git a/scss/_md.scss b/scss/_md.scss new file mode 100644 index 0000000..ef848dc --- /dev/null +++ b/scss/_md.scss @@ -0,0 +1,7 @@ + +@forward 'tokens/sys/elevation'; +@forward 'tokens/sys/motion'; +@forward 'tokens/sys/shape'; +@forward 'tokens/sys/state'; +@forward 'tokens/sys/typescale'; +@forward 'tokens/sys/themes/light'; diff --git a/scss/_textfield-filled.scss b/scss/_textfield-filled.scss new file mode 100644 index 0000000..dbb010a --- /dev/null +++ b/scss/_textfield-filled.scss @@ -0,0 +1,336 @@ +// This Source Code Form is subject to the terms of the Mozilla Public +// License, v. 2.0. If a copy of the MPL was not distributed with this +// file, You can obtain one at https://mozilla.org/MPL/2.0/. + +@use 'sass:color'; +@use 'functions'; +@use 'variables'; +@use 'md' as *; +@use 'tokens/dp'; + +$textfield-classname: textfield !default; +$filled-classname: #{$textfield-classname}-filled !default; +$container-classname: #{$textfield-classname}-container !default; +$leadingicon-classname: #{$textfield-classname}-leading-icon !default; +$label-classname: #{$textfield-classname}-label !default; +$input-classname: #{$textfield-classname}-input !default; +$trailingicon-classname: #{$textfield-classname}-trailing-icon !default; +$supportingtext-classname: #{$textfield-classname}-supporting-text !default; +$disabled-classname: #{$textfield-classname}-disabled !default; + +// Filled text field states +// enabled state +$filled-enabled-container-color: $md-sys-color-surface-variant; +$filled-enabled-container-shape: $md-sys-shape-corner-extra-small-top; +$filled-enabled-leading-icon-color: $md-sys-color-on-surface-variant; +$filled-enabled-leading-icon-size: dp.$twenty-four; +$filled-enabled-label-text-color: $md-sys-color-on-surface-variant; +$filled-enabled-label-text-font: $md-sys-typescale-body-large-font; +$filled-enabled-label-text-line-height: $md-sys-typescale-body-large-line-height; +$filled-enabled-label-text-size: $md-sys-typescale-body-large-size; +$filled-enabled-label-text-weight: $md-sys-typescale-body-large-weight; +$filled-enabled-label-text-tracking: $md-sys-typescale-body-large-tracking; +$filled-enabled-label-text-line-height-populated: $md-sys-typescale-body-small-line-height; +$filled-enabled-label-text-size-populated: $md-sys-typescale-body-small-size; +$filled-enabled-trailing-icon-color: $md-sys-color-on-surface-variant; +$filled-enabled-trailing-icon-size: dp.$twenty-four; +$filled-enabled-active-indicator-height: dp.$one; +$filled-enabled-active-indicator-color: $md-sys-color-on-surface-variant; +$filled-enabled-caret-color: $md-sys-color-primary; +$filled-enabled-input-text-color: $md-sys-color-on-surface; +$filled-enabled-input-text-font: $md-sys-typescale-body-large-font; +$filled-enabled-input-text-line: $md-sys-typescale-body-large-line-height; +$filled-enabled-input-text-size: $md-sys-typescale-body-large-size; +$filled-enabled-input-text-weight: $md-sys-typescale-body-large-weight; +$filled-enabled-input-text-tracking: $md-sys-typescale-body-large-tracking; +$filled-enabled-supporting-text-color: $md-sys-color-on-surface-variant; +$filled-enabled-supporting-text-font: $md-sys-typescale-body-small-font; +$filled-enabled-supporting-text-line-height: $md-sys-typescale-body-small-line-height; +$filled-enabled-supporting-text-size: $md-sys-typescale-body-small-size; +$filled-enabled-supporting-text-weight: $md-sys-typescale-body-small-weight; +$filled-enabled-supporting-text-tracking: $md-sys-typescale-body-small-tracking; + +// $filled-enabled-placeholder-input-text: $md-sys-color-on-surface-variant; +// $filled-enabled-prefix-input-label: $md-sys-color-on-surface-variant; +// $filled-enabled-suffix-input-label-color: $md-sys-color-on-surface-variant; +// focussed state +$filled-focussed-active-indicator-height: dp.$two; +$filled-focussed-active-indicator-color: $md-sys-color-primary; +$filled-focussed-label-text-color: $md-sys-color-primary; +$filled-focussed-input-text-color: $md-sys-color-on-surface; +$filled-focussed-supporting-text-color: $md-sys-color-on-surface-variant; +$filled-focussed-leading-icon-color: $md-sys-color-on-surface-variant; +$filled-focussed-trailing-icon-color: $md-sys-color-on-surface-variant; + +// hovered state +$filled-hovered-active-indicator-height: dp.$one; +$filled-hovered-active-indicator-color: $md-sys-color-on-surface; +$filled-hovered-label-text-color: $md-sys-color-on-surface-variant; +$filled-hovered-input-text-color: $md-sys-color-on-surface; +$filled-hovered-supporting-text-color: $md-sys-color-on-surface-variant; +$filled-hovered-leading-icon-color: $md-sys-color-on-surface-variant; +$filled-hovered-trailing-icon-color: $md-sys-color-on-surface-variant; + +// $filled-hovered-state-layer-color: $md-sys-color-on-surface; +// $filled-hovered-state-layer-opacity: $md-sys-state-hover-state-layer-opacity; +// disabled state +$filled-disabled-container-color: $md-sys-color-on-surface; +$filled-disabled-container-opacity: 4%; +$filled-disabled-active-indicator-height: dp.$one; +$filled-disabled-active-indicator-color: $md-sys-color-on-surface; +$filled-disabled-active-indicator-opacity: 38%; +$filled-disabled-label-text-color: $md-sys-color-on-surface; +$filled-disabled-label-text-opacity: 38%; +$filled-disabled-input-text-color: $md-sys-color-on-surface; +$filled-disabled-input-text-opacity: 38%; +$filled-disabled-supporting-text-color: $md-sys-color-on-surface; +$filled-disabled-supporting-text-opacity: 38%; +$filled-disabled-leading-icon-color: $md-sys-color-on-surface; +$filled-disabled-leading-icon-opacity: 38%; +$filled-disabled-trailing-icon-color: $md-sys-color-on-surface; +$filled-disabled-trailing-icon-opacity: 38%; +$filled-disabled-trailing-icon-opacity: 38%; + +// Filled text field layout +$filled-default-container-height: dp.$fifty-six; +$filled-top-bottom-padding: dp.$eight; +$filled-left-right-padding-without-icons: dp.$sixteen; +$filled-left-right-padding-with-icons: dp.$twelve; + +// $filled-padding-between-icons-and-text: dp.$sixteen; +$filled-supporting-text-and-character-counter-top-padding: dp.$four; + +// $filled-padding-between-supporting-text-and-character-counter: dp.$sixteen; +// $filled-target-size: dp.$fifty-six; + +.#{$filled-classname} { + & *, *::before, *::after { + box-sizing: border-box; + } + + & > .#{$container-classname} { + align-items: center; + background-color: $filled-enabled-container-color; + border-radius: $filled-enabled-container-shape; + cursor: pointer; + display: flex; + height: $filled-default-container-height; + padding-bottom: $filled-top-bottom-padding; + padding-top: $filled-top-bottom-padding; + position: relative; + + // represents the 'Active indicator' (the bottom line that changes color and increases its size when focussed) + &::after { + border-bottom: $filled-enabled-active-indicator-height solid $filled-enabled-active-indicator-color; + bottom: 0; + content: ' '; + left: 0; + pointer-events: none; + position: absolute; + user-select: none; + width: 100%; + } + + & > .#{$leadingicon-classname} { + color: $filled-enabled-leading-icon-color; + font-size: $filled-enabled-leading-icon-size; + line-height: 1; + margin-left: $filled-left-right-padding-with-icons; + pointer-events: none; + user-select: none; + + // re-position the label whenever the leading icon is defined + & ~ .#{$label-classname} { + left: dp.$fifty-two; + } + } + + & > .#{$input-classname} { + align-self: end; + background: none; + border-width: 0; + caret-color: $filled-enabled-caret-color; + color: $filled-enabled-input-text-color; + font-family: $filled-enabled-input-text-font; + font-size: $filled-enabled-input-text-size; + font-weight: $filled-enabled-input-text-weight; + letter-spacing: $filled-enabled-input-text-tracking; + line-height: $filled-enabled-input-text-line; + margin-left: $filled-left-right-padding-without-icons; + margin-right: $filled-left-right-padding-without-icons; + padding: 0; + width: 100%; + + // input focussed + &:focus { + outline: none; + & ~ .#{$label-classname} { + color: $filled-focussed-label-text-color; + } + } + + // the input is empty and not focused + &:placeholder-shown:not(:focus) ~ .#{$label-classname} { + font-size: $filled-enabled-label-text-size; + line-height: $filled-enabled-label-text-line-height; + top: dp.$sixteen; + } + } + + // by default the label is styled in 'populated mode' so that browsers not supporting 'advanced' css are ok + & > .#{$label-classname} { + color: $filled-enabled-label-text-color; + font-family: $filled-enabled-label-text-font; + font-size: $filled-enabled-label-text-size-populated; + font-weight: $filled-enabled-label-text-weight; + left: $filled-left-right-padding-without-icons; + letter-spacing: $filled-enabled-label-text-tracking; + line-height: $filled-enabled-label-text-line-height-populated; + margin-right: $filled-left-right-padding-without-icons; + pointer-events: none; + position: absolute; + top: $filled-top-bottom-padding; + transition-duration: $md-sys-motion-transition-duration; + transition-property: color, transform, top, font-size, line-height, left, padding; + transition-timing-function: $md-sys-motion-easing-standard-curve; + user-select: none; + } + + & > .#{$trailingicon-classname} { + color: $filled-enabled-trailing-icon-color; + font-size: $filled-enabled-trailing-icon-size; + line-height: 1; + margin-right: $filled-left-right-padding-with-icons; + pointer-events: none; + transition-duration: $md-sys-motion-transition-duration; + transition-property: color; + transition-timing-function: $md-sys-motion-easing-standard-curve; + user-select: none; + } + } + + & > .#{$supportingtext-classname} { + color: $filled-enabled-supporting-text-color; + display: block; + font-family: $filled-enabled-supporting-text-font; + font-size: $filled-enabled-supporting-text-size; + font-weight: $filled-enabled-supporting-text-weight; + line-height: $filled-enabled-supporting-text-line-height; + margin-left: $filled-left-right-padding-without-icons; + margin-top: $filled-supporting-text-and-character-counter-top-padding; + letter-spacing: $filled-enabled-supporting-text-tracking; + } + + // disabled state + &.#{$disabled-classname} { + & > .#{$container-classname} { + cursor: auto; + + // background-color: $filled-disabled-container-color; + // opacity: $filled-disabled-container-opacity; + + // represents the 'Active indicator' (the bottom line that changes color and increases its size when focussed) + &::after { + background-color: $filled-disabled-active-indicator-color; + height: $filled-disabled-active-indicator-height px; + opacity: $filled-disabled-active-indicator-opacity; + } + + & > .#{$leadingicon-classname} { + color: $filled-disabled-leading-icon-color; + opacity: $filled-disabled-leading-icon-opacity; + } + + & > .#{$input-classname} { + color: $filled-disabled-input-text-color; + opacity: $filled-disabled-input-text-opacity; + pointer-events: none; + user-select: none; + } + + & > .#{$label-classname} { + color: $filled-disabled-label-text-color; + opacity: $filled-disabled-label-text-opacity; + } + + & > .#{$trailingicon-classname} { + color: $filled-disabled-trailing-icon-color; + opacity: $filled-disabled-trailing-icon-opacity; + } + } + & > .#{$supportingtext-classname} { + color: $filled-disabled-supporting-text-color; + opacity: $filled-disabled-supporting-text-opacity; + } + } + + // hover state + &:not(.#{$disabled-classname}):hover { + & > .#{$container-classname} { +// background-color: $filled-hovered-state-layer-color; +// opacity: $filled-hovered-state-layer-opacity; + + // active indicator + &::after { + border-color: $filled-hovered-active-indicator-color; + border-width: $filled-hovered-active-indicator-height; + } + + & > .#{$leadingicon-classname} { + color: $filled-hovered-leading-icon-color; + } + + & > .#{$input-classname} { + color: $filled-hovered-input-text-color; + } + + & > .#{$label-classname} { + color: $filled-hovered-label-text-color + } + + & > .#{$trailingicon-classname} { + color: $filled-hovered-trailing-icon-color; + } + } + + & > .#{$supportingtext-classname} { + color: $filled-hovered-supporting-text-color; + } + + } + + // focused state + &:not(.#{$disabled-classname}):focus-within { // 95% browser support on caniuse + & > .#{$container-classname} { + // active indicator focussed + &::after { + border-bottom-color: $filled-focussed-active-indicator-color; + border-bottom-width: $filled-focussed-active-indicator-height; + transition-duration: $md-sys-motion-transition-duration; + transition-property: border-color, border-width; + transition-timing-function: $md-sys-motion-easing-standard-curve; + } + + & > .#{$leadingicon-classname} { + color: $filled-focussed-leading-icon-color; + } + + & > .#{$input-classname} { + color: $filled-focussed-input-text-color; + } + + & > .#{$trailingicon-classname} { + color: $filled-focussed-trailing-icon-color; + } + + & > .#{$label-classname} { + color: $filled-focussed-label-text-color; + } + } + + & > .#{$supportingtext-classname} { + color: $filled-focussed-supporting-text-color; + } + } + +} \ No newline at end of file diff --git a/scss/_textfield-outlined.scss b/scss/_textfield-outlined.scss new file mode 100644 index 0000000..03d057b --- /dev/null +++ b/scss/_textfield-outlined.scss @@ -0,0 +1,326 @@ +// This Source Code Form is subject to the terms of the Mozilla Public +// License, v. 2.0. If a copy of the MPL was not distributed with this +// file, You can obtain one at https://mozilla.org/MPL/2.0/. + +@use 'sass:color'; +@use 'functions'; +@use 'variables'; +@use 'md' as *; +@use 'tokens/dp'; + +$textfield-classname: textfield !default; +$outlined-classname: #{$textfield-classname}-outlined !default; +$container-classname: #{$textfield-classname}-container !default; +$leadingicon-classname: #{$textfield-classname}-leading-icon !default; +$label-classname: #{$textfield-classname}-label !default; +$input-classname: #{$textfield-classname}-input !default; +$trailingicon-classname: #{$textfield-classname}-trailing-icon !default; +$supportingtext-classname: #{$textfield-classname}-supporting-text !default; +$disabled-classname: #{$textfield-classname}-disabled !default; + +// outlined variables +$outlined-layout-container-height: dp.$fifty-six; +$outlined-layout-left-right-padding-without-icon: dp.$sixteen; +$outlined-layout-left-right-padding-with-icon: dp.$twelve; + +// $outlined-layout-padding-between-icons-and-text: dp.$sixteen; +// $outlined-layout-padding-between-supporting-text-and-character-count-top-padding: dp.$sixteen; +$outlined-layout-supporting-text-and-character-count-top-padding: dp.$four; +$outlined-layout-left-right-populated-label-text: dp.$four; + +// outlined enabled state +$outlined-enabled-container-background-color: white; +$outlined-enabled-container-shape: $md-sys-shape-corner-extra-small; +$outlined-enabled-container-outline-width: dp.$one; +$outlined-enabled-container-outline-color: $md-sys-color-outline; +$outlined-enabled-label-text-color: $md-sys-color-on-surface-variant; +$outlined-enabled-label-text-font: $md-sys-typescale-body-large-font; +$outlined-enabled-label-text-line-height: $md-sys-typescale-body-large-line-height; +$outlined-enabled-label-text-size: $md-sys-typescale-body-large-size; +$outlined-enabled-label-text-weight: $md-sys-typescale-body-large-weight; +$outlined-enabled-label-text-tracking: $md-sys-typescale-body-large-tracking; +$outlined-enabled-leading-icon-color: $md-sys-color-on-surface-variant; +$outlined-enabled-leading-icon-size: dp.$twenty-four; +$outlined-enabled-label-text-line-height-populated: $md-sys-typescale-body-small-line-height; +$outlined-enabled-label-text-size-populated: $md-sys-typescale-body-small-size; +$outlined-enabled-trailing-icon-color: $md-sys-color-on-surface-variant; +$outlined-enabled-trailing-icon-size: dp.$twenty-four; +$outlined-enabled-caret-color: $md-sys-color-primary; +$outlined-enabled-input-text-color: $md-sys-color-on-surface; +$outlined-enabled-input-text-font: $md-sys-typescale-body-large-font; +$outlined-enabled-input-text-line-height: $md-sys-typescale-body-large-line-height; +$outlined-enabled-input-text-size: $md-sys-typescale-body-large-size; +$outlined-enabled-input-text-weight: $md-sys-typescale-body-large-weight; +$outlined-enabled-input-text-tracking: $md-sys-typescale-body-large-tracking; +$outlined-enabled-supporting-text-color: $md-sys-color-on-surface-variant; +$outlined-enabled-supporting-text-font: $md-sys-typescale-body-small-font; +$outlined-enabled-supporting-text-line-height: $md-sys-typescale-body-small-line-height; +$outlined-enabled-supporting-text-size: $md-sys-typescale-body-small-size; +$outlined-enabled-supporting-text-weight: $md-sys-typescale-body-small-weight; +$outlined-enabled-supporting-text-tracking: $md-sys-typescale-body-small-tracking; + +// $outlined-enabled-placeholder-input-text-color: $md-sys-color-on-surface-variant; +// $outlined-enabled-suffix-input-text-color: $md-sys-color-on-surface-variant; +// $outlined-enabled-prefix-input-text-color: $md-sys-color-on-surface-variant; + +// outlined disabled state +$outlined-disabled-outline-width: dp.$one; +$outlined-disabled-outline-color: $md-sys-color-on-surface; +$outlined-disabled-outline-opacity: 12%; +$outlined-disabled-label-text-color: $md-sys-color-on-surface; +$outlined-disabled-label-text-opacity: 38%; +$outlined-disabled-input-text-color: $md-sys-color-on-surface; +$outlined-disabled-input-text-opacity: 38%; +$outlined-disabled-supporting-text-color: $md-sys-color-on-surface; +$outlined-disabled-supporting-text-opacity: 38%; +$outlined-disabled-leading-icon-color: $md-sys-color-on-surface; +$outlined-disabled-leading-icon-opacity: 38%; +$outlined-disabled-trailing-icon-color: $md-sys-color-on-surface; +$outlined-disabled-trailing-icon-opacity: 38%; + +// outlined focussed state +$outlined-focussed-outline-width: dp.$two; +$outlined-focussed-outline-color: $md-sys-color-primary; +$outlined-focussed-label-text-color: $md-sys-color-primary; +$outlined-focussed-input-text-color: $md-sys-color-on-surface; +$outlined-focussed-supporting-text-color: $md-sys-color-on-surface-variant; +$outlined-focussed-leading-icon-color: $md-sys-color-on-surface-variant; +$outlined-focussed-trailing-icon-color: $md-sys-color-on-surface-variant; + +// outlined hovered state +$outlined-hovered-outline-width: dp.$one; +$outlined-hovered-outline-color: $md-sys-color-on-surface; +$outlined-hovered-label-text-color: $md-sys-color-on-surface; +$outlined-hovered-input-text-color: $md-sys-color-on-surface; +$outlined-hovered-supporting-text-color: $md-sys-color-on-surface-variant; +$outlined-hovered-leading-icon-color: $md-sys-color-on-surface-variant; +$outlined-hovered-trailing-icon-color: $md-sys-color-on-surface-variant; + +.#{$outlined-classname} { + & *, *::before, *::after { + box-sizing: border-box; + } + + & > .#{$container-classname} { + align-items: center; + display: flex; + height: $outlined-layout-container-height; + margin-top: dp.$eight; // to account for the label overlapping the outline + position: relative; + + // represents the 'outline', basically the border around the input + &::after { + border-width: $outlined-enabled-container-outline-width; + border-color: $outlined-enabled-container-outline-color; + border-radius: $outlined-enabled-container-shape; + border-style: solid; + bottom: 0; + content: ' '; + height: 100%; + left: 0; + pointer-events: none; + position: absolute; + top: 0; + user-select: none; + width: 100%; + } + + // leading icon + & > .#{$leadingicon-classname} { + color: $outlined-enabled-leading-icon-color; + font-size: $outlined-enabled-leading-icon-size; + line-height: 1; + margin-left: $outlined-layout-left-right-padding-with-icon; + pointer-events: none; + user-select: none; + + & ~ .#{$input-classname}:placeholder-shown:not(:focus) ~ .#{$label-classname} { + left: dp.$fifty-two; + } + } + + // input + & > .#{$input-classname} { + background: none; + border-width: 0; + caret-color: $outlined-enabled-caret-color; + color: $outlined-enabled-input-text-color; + font-family: $outlined-enabled-input-text-font; + font-size: $outlined-enabled-input-text-size; + font-weight: $outlined-enabled-input-text-weight; + letter-spacing: $outlined-enabled-input-text-tracking; + line-height: $outlined-enabled-input-text-line-height; + margin-left: $outlined-layout-left-right-padding-without-icon; + margin-right: $outlined-layout-left-right-padding-without-icon; + padding: 0; + width: 100%; + + &:focus { + outline: none; + } + + // input is empty and not focused + &:placeholder-shown:not(:focus) ~ .#{$label-classname} { + font-size: $outlined-enabled-label-text-size; + line-height: $outlined-enabled-label-text-line-height; + padding-left: 0; + padding-right: 0; + top: dp.$sixteen; + } + } + + // label - by default it's styled in 'populated mode' so that browsers not supporting 'advanced' css are ok + & > .#{$label-classname} { + background-color: $outlined-enabled-container-background-color; + color: $outlined-enabled-label-text-color; + font-family: $outlined-enabled-label-text-font; + font-size: $outlined-enabled-label-text-size-populated; + font-weight: $outlined-enabled-label-text-weight; + left: $outlined-layout-left-right-padding-without-icon; + letter-spacing: $outlined-enabled-label-text-tracking; + line-height: $outlined-enabled-label-text-line-height-populated; + padding-left: $outlined-layout-left-right-populated-label-text; + padding-right: $outlined-layout-left-right-populated-label-text; + pointer-events: none; + position: absolute; + top: -(dp.$eight - dp.$one); + transition-duration: $md-sys-motion-transition-duration; + transition-property: color, transform, top, font-size, line-height, left, padding; + transition-timing-function: $md-sys-motion-easing-standard-curve; + user-select: none; + z-index: 2; + } + + // trailing icon + & > .#{$trailingicon-classname} { + color: $outlined-enabled-trailing-icon-color; + font-size: $outlined-enabled-trailing-icon-size; + line-height: 1; + margin-right: $outlined-layout-left-right-padding-with-icon; + pointer-events: none; + transition-duration: $md-sys-motion-transition-duration; + transition-property: color; + transition-timing-function: $md-sys-motion-easing-standard-curve; + user-select: none; + } + } + + // supporting-text + & > .#{$supportingtext-classname} { + color: $outlined-enabled-supporting-text-color; + display: block; + font-family: $outlined-enabled-supporting-text-font; + font-size: $outlined-enabled-supporting-text-size; + font-weight: $outlined-enabled-supporting-text-weight; + line-height: $outlined-enabled-supporting-text-line-height; + margin-left: $outlined-layout-left-right-padding-without-icon; + margin-top: $outlined-layout-supporting-text-and-character-count-top-padding; + letter-spacing: $outlined-enabled-supporting-text-tracking; + } + + // disabled state + &.#{$disabled-classname} { + & > .#{$container-classname} { + // outline + &::after { + border-width: $outlined-disabled-outline-width; + border-color: $outlined-disabled-outline-color; + opacity: $outlined-disabled-outline-opacity; + } + + & > .#{$leadingicon-classname} { + color: $outlined-disabled-leading-icon-color; + opacity: $outlined-disabled-leading-icon-opacity; + } + + & > .#{$input-classname} { + color: $outlined-disabled-input-text-color; + opacity: $outlined-disabled-input-text-opacity; + pointer-events: none; + user-select: none; + } + + & > .#{$label-classname} { + color: $outlined-disabled-label-text-color; + opacity: $outlined-disabled-label-text-opacity; + } + + & > .#{$trailingicon-classname} { + color: $outlined-disabled-trailing-icon-color; + opacity: $outlined-disabled-trailing-icon-opacity; + } + } + & > .#{$supportingtext-classname} { + color: $outlined-disabled-supporting-text-color; + opacity: $outlined-disabled-supporting-text-opacity; + } + } + + // hover state + &:not(.#{$disabled-classname}):hover { + & > .#{$container-classname} { + // outline + &::after { + border-width: $outlined-hovered-outline-width; + border-color: $outlined-hovered-outline-color; + transition-duration: $md-sys-motion-transition-duration; + transition-property: border-color, border-width; + transition-timing-function: $md-sys-motion-easing-standard-curve; + } + + & > .#{$leadingicon-classname} { + color: $outlined-hovered-leading-icon-color; + } + + & > .#{$input-classname} { + color: $outlined-hovered-input-text-color; + } + + & > .#{$trailingicon-classname} { + color: $outlined-hovered-trailing-icon-color; + } + + & > .#{$label-classname} { + color: $outlined-hovered-label-text-color; + } + } + + & > .#{$supportingtext-classname} { + color: $outlined-hovered-supporting-text-color; + } + } + + // focused state + &:not(.#{$disabled-classname}):focus-within { // 95% browser support on caniuse + & > .#{$container-classname} { + // outline + &::after { + border-width: $outlined-focussed-outline-width; + border-color: $outlined-focussed-outline-color; + transition-duration: $md-sys-motion-transition-duration; + transition-property: border-color, border-width; + transition-timing-function: $md-sys-motion-easing-standard-curve; + } + + & > .#{$leadingicon-classname} { + color: $outlined-focussed-leading-icon-color; + } + + & > .#{$input-classname} { + color: $outlined-focussed-input-text-color; + } + + & > .#{$trailingicon-classname} { + color: $outlined-focussed-trailing-icon-color; + } + + & > .#{$label-classname} { + color: $outlined-focussed-label-text-color; + } + } + + & > .#{$supportingtext-classname} { + color: $outlined-focussed-supporting-text-color; + } + } +} diff --git a/scss/material-design-light.scss b/scss/material-design-light.scss index 397c44c..e881966 100644 --- a/scss/material-design-light.scss +++ b/scss/material-design-light.scss @@ -19,7 +19,8 @@ @include meta.load-css('card'); @include meta.load-css('nav'); @include meta.load-css('buttons'); -@include meta.load-css('fields'); +@include meta.load-css('textfield-filled'); +@include meta.load-css('textfield-outlined'); @include meta.load-css('typography'); // Utilities diff --git a/scss/tokens/_dp.scss b/scss/tokens/_dp.scss new file mode 100644 index 0000000..3033119 --- /dev/null +++ b/scss/tokens/_dp.scss @@ -0,0 +1,13 @@ +// This Source Code Form is subject to the terms of the Mozilla Public +// License, v. 2.0. If a copy of the MPL was not distributed with this +// file, You can obtain one at https://mozilla.org/MPL/2.0/. + +$one: 0.0625rem; +$two: 0.125rem; +$four: 0.25rem; +$eight: 0.5rem; +$twelve: 0.75rem; +$sixteen: 1rem; +$twenty-four: 1.5rem; +$fifty-two: 3.25rem; +$fifty-six: 3.5rem; \ No newline at end of file diff --git a/site/src/index.njk b/site/src/index.njk index 7b9594d..74407de 100644 --- a/site/src/index.njk +++ b/site/src/index.njk @@ -84,39 +84,95 @@ keywords:
Supporting text
+Supporting text
+