:root {
  --appbar-height: 64px;
  --collapse-height-96: 96px;
  --collapse-height-192: 192px;
  --clr-pri: #3F5F90;
  --clr-sfc-tint: #3F5F90;
  --clr-on-pri: #FFFFFF;
  --clr-pri-cntr: #D6E3FF;
  --clr-on-pri-cntr: #254777;
  --clr-sec: #555F71;
  --clr-on-sec: #FFFFFF;
  --clr-sec-cntr: #D9E3F8;
  --clr-on-sec-cntr: #3E4758;
  --clr-ter: #00677C;
  --clr-on-ter: #FFFFFF;
  --clr-ter-cntr: #B2EBFF;
  --clr-on-ter-cntr: #004E5E;
  --clr-error: #BA1A1A;
  --clr-on-error: #FFFFFF;
  --clr-error-cntr: #FFDAD6;
  --clr-on-error-cntr: #93000A;
  --clr-background: #F9F9FF;
  --clr-on-background: #191C20;
  --clr-sfc: #F9F9FF;
  --clr-on-sfc: #191C20;
  --clr-sfc-var: #E0E2EC;
  --clr-on-sfc-var: #43474E;
  --clr-outline: #74777F;
  --clr-outline-var: #C4C6CF;
  --clr-shadow: #000000;
  --clr-scrim: #000000;
  --clr-inverse-sfc: #2E3035;
  --clr-inverse-on-sfc: #F0F0F7;
  --clr-inverse-pri: #A8C8FF;
  --clr-pri-fixed: #D6E3FF;
  --clr-on-pri-fixed: #001B3C;
  --clr-pri-fixed-dim: #A8C8FF;
  --clr-on-pri-fixed-var: #254777;
  --clr-sec-fixed: #D9E3F8;
  --clr-on-sec-fixed: #121C2B;
  --clr-sec-fixed-dim: #BDC7DC;
  --clr-on-sec-fixed-var: #3E4758;
  --clr-ter-fixed: #B2EBFF;
  --clr-on-ter-fixed: #001F27;
  --clr-ter-fixed-dim: #86D1E9;
  --clr-on-ter-fixed-var: #004E5E;
  --clr-sfc-dim: #D9D9E0;
  --clr-sfc-bright: #F9F9FF;
  --clr-sfc-cntr-lowest: #FFFFFF;
  --clr-sfc-cntr-low: #F3F3FA;
  --clr-sfc-cntr: #EDEDF4;
  --clr-sfc-cntr-high: #E7E8EE;
  --clr-sfc-cntr-highest: #E1E2E9;
  --default-borderradius: 4px;
  --elev-0: none;
  --elev-1: 0px 2px 1px -1px rgba(0,0,0,0.2), 0px 1px 1px 0px rgba(0,0,0,0.14), 0px 1px 3px 0px rgba(0,0,0,0.12);
  --elev-2: 0px 6px 3px -3px rgba(0,0,0,0.2), 0px 3px 3px 0px rgba(0,0,0,0.14), 0px 3px 9px 0px rgba(0,0,0,0.12);
  --elev-3: 0px 12px 6px -6px rgba(0,0,0,0.2), 0px 6px 6px 0px rgba(0,0,0,0.14), 0px 6px 18px 0px rgba(0,0,0,0.12);
  --elev-4: 0px 16px 8px -1px rgba(0,0,0,0.2), 0px 8px 8px 0px rgba(0,0,0,0.14), 0px 8px 24px 0px rgba(0,0,0,0.12);
  --hover-opacity: 0.08;
  --hover-opacity-percent: 8%;
  --hover-opacity-variant: 0.04;
  --focus-opacity: 0.1;
  --focus-opacity-percent: 10%;
  --pressed-opacity: 0.1;
  --pressed-opacity-percent: 10%;
  --dragged-opacity: 0.16;
  --dragged-opacity-percent: 16%;
  --disabled-opacity-container: 0.1;
  --disabled-opacity-container-percent: 10%;
  --disabled-opacity-content: 0.38;
  --disabled-opacity-content-percent: 38%;
  --disabled-opacity-outline: 0.12;
  --clr-disabled-text: rgb(from var(--clr-on-sfc) r g b / var(--disabled-opacity-content));
  --zws: "\200b";
  /* typography size tokens */
  --typ-r-s: 16px;
  --typ-r-l: 1.5rem;
  --typ-r-t: .5px;
  --typ-r-w: 400;
  /* display typography */
  --typ-d-lg-s: 3.5625rem;
  --typ-d-lg-l: 4rem;
  --typ-d-lg-t: -0.25px;
  --typ-d-lg-w: 400;
  --typ-d-lg-pt: .5em;
  --typ-d-lg-pb: .5em;
  --typ-d-md-s: 2.8125rem;
  --typ-d-md-l: 3.25rem;
  --typ-d-md-t: 0;
  --typ-d-md-w: 400;
  --typ-d-md-pt: .5em;
  --typ-d-md-pb: .5em;
  --typ-d-sm-s: 2.25rem;
  --typ-d-sm-l: 2.75rem;
  --typ-d-sm-t: 0;
  --typ-d-sm-w: 400;
  --typ-d-sm-pt: .5em;
  --typ-d-sm-pb: .5em;
  /* headline */
  --typ-h-lg-s: 2rem;
  --typ-h-lg-l: 2.5rem;
  --typ-h-lg-t: 0;
  --typ-h-lg-w: 400;
  --typ-h-lg-pt: .5em;
  --typ-h-lg-pb: .5em;
  --typ-h-md-s: 1.75rem;
  --typ-h-md-l: 2.25rem;
  --typ-h-md-t: 0;
  --typ-h-md-w: 400;
  --typ-h-md-pt: .5em;
  --typ-h-md-pb: .5em;
  --typ-h-sm-s: 1.5rem;
  --typ-h-sm-l: 2rem;
  --typ-h-sm-t: 0;
  --typ-h-sm-w: 400;
  --typ-h-sm-pt: .5em;
  --typ-h-sm-pb: .5em;
  /* title */
  --typ-t-lg-s: 1.375rem;
  --typ-t-lg-l: 1.625rem;
  --typ-t-lg-t: 0;
  --typ-t-lg-w: 400;
  --typ-t-md-s: 1rem;
  --typ-t-md-l: 1.5rem;
  --typ-t-md-t: 0.15px;
  --typ-t-md-w: 500;
  --typ-t-sm-s: .875rem;
  --typ-t-sm-l: 1.25rem;
  --typ-t-sm-t: 0.1px;
  --typ-t-sm-w: 500;
  /* body */
  --typ-b-lg-s: 1rem;
  --typ-b-lg-l: 1.5rem;
  --typ-b-lg-t: .5px;
  --typ-b-lg-w: 400;
  --typ-b-md-s: .875rem;
  --typ-b-md-l: 1.25rem;
  --typ-b-md-t: .25px;
  --typ-b-md-w: 400;
  --typ-b-sm-s: .75rem;
  --typ-b-sm-l: 1em;
  --typ-b-sm-t: 0.4px;
  --typ-b-sm-w: 400;
  /* label */
  --typ-l-lg-s: .875rem;
  --typ-l-lg-l: 1.25rem;
  --typ-l-lg-t: .1px;
  --typ-l-lg-w: 500;
  --typ-l-md-s: .75rem;
  --typ-l-md-l: 1rem;
  --typ-l-md-t: .5px;
  --typ-l-md-w: 500;
  --typ-l-sm-s: .6875rem;
  --typ-l-sm-l: 1rem;
  --typ-l-sm-t: .5px;
  --typ-l-sm-w: 500;
}

.msr-i {
  font-family: Material Symbols Rounded;
  font-style: normal;
  font-weight: normal;
  font-size: 16px;
  display: inline-block;
  line-height: 1;
  text-transform: none;
  letter-spacing: normal;
  word-wrap: normal;
  white-space: nowrap;
  direction: ltr;
}

.mso {
  font-family: Material Symbols Outlined;
  font-style: normal;
  font-weight: normal;
  font-size: 24px;
  display: inline-block;
  line-height: 1;
  text-transform: none;
  letter-spacing: normal;
  word-wrap: normal;
  white-space: nowrap;
  direction: ltr;
}

.mso-s {
  font-family: Material Symbols Outlined;
  font-style: normal;
  font-weight: normal;
  font-size: 20px;
  display: inline-block;
  line-height: 1;
  text-transform: none;
  letter-spacing: normal;
  word-wrap: normal;
  white-space: nowrap;
  direction: ltr;
}

html, body {
  font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Fira Sans", Oxygen, Cantarell, "Droid Sans", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Lucida Grande", Helvetica, Arial, sans-serif;
  font-size: var(--typ-r-s);
  line-height: var(--typ-r-l);
  letter-spacing: var(--typ-r-t);
  font-weight: var(--typ-r-w);
  margin: 0;
}

@font-face {
  font-family: "Material Symbols Outlined";
  font-style: normal;
  src: url("/_content/ElJay.Blazor.Styles/font/MaterialSymbolsOutlined[FILL,GRAD,opsz,wght].woff2") format("woff2");
}
@font-face {
  font-family: "Material Symbols Rounded";
  font-style: normal;
  src: url("/_content/ElJay.Blazor.Styles/font/MaterialSymbolsRounded[FILL,GRAD,opsz,wght].woff2") format("woff2");
}
/* Display */
h1, .h1, .typ-d-lg {
  font-size: var(--typ-d-lg-s);
  line-height: var(--typ-d-lg-l);
  letter-spacing: var(--typ-d-lg-t);
  font-weight: var(--typ-d-lg-w);
  margin: unset;
}

h2, .h2, .typ-d-md {
  font-size: var(--typ-d-md-s);
  line-height: var(--typ-d-md-l);
  letter-spacing: var(--typ-d-md-t);
  font-weight: var(--typ-d-md-w);
  margin: unset;
}

h3, .h3, .typ-d-sm {
  font-size: var(--typ-d-sm-s);
  line-height: var(--typ-d-sm-l);
  letter-spacing: var(--typ-d-sm-t);
  font-weight: var(--typ-d-sm-w);
  margin: unset;
}

/* Headline */
h4, .h4, .typ-h-lg {
  font-size: var(--typ-h-lg-s);
  line-height: var(--typ-h-lg-l);
  letter-spacing: var(--typ-h-lg-t);
  font-weight: var(--typ-h-lg-w);
  margin: unset;
}

h5, .h5, .typ-h-md {
  font-size: var(--typ-h-md-s);
  line-height: var(--typ-h-md-l);
  letter-spacing: var(--typ-h-md-t);
  font-weight: var(--typ-h-md-w);
  margin: unset;
}

h6, .h6, .typ-h-sm {
  font-size: var(--typ-h-sm-s);
  line-height: var(--typ-h-sm-l);
  letter-spacing: var(--typ-h-sm-t);
  font-weight: var(--typ-h-sm-w);
  margin: unset;
}

/* Title */
.typ-t-lg {
  font-size: var(--typ-t-lg-s);
  line-height: var(--typ-t-lg-l);
  letter-spacing: var(--typ-t-lg-t);
  font-weight: var(--typ-t-lg-w);
}

.typ-t-md {
  font-size: var(--typ-t-md-s);
  line-height: var(--typ-t-md-l);
  letter-spacing: var(--typ-t-md-t);
  font-weight: var(--typ-t-md-w);
}

.typ-t-sm {
  font-size: var(--typ-t-sm-s);
  line-height: var(--typ-t-sm-l);
  letter-spacing: var(--typ-t-sm-t);
  font-weight: var(--typ-t-sm-w);
}

/* Body */
.typ-b-lg {
  font-size: var(--typ-b-lg-s);
  line-height: var(--typ-b-lg-l);
  letter-spacing: var(--typ-b-lg-t);
  font-weight: var(--typ-b-lg-w);
}

.typ-b-md {
  font-size: var(--typ-b-md-s);
  line-height: var(--typ-b-md-l);
  letter-spacing: var(--typ-b-md-t);
  font-weight: var(--typ-b-md-w);
}

.typ-b-sm {
  font-size: var(--typ-b-sm-s);
  line-height: var(--typ-b-sm-l);
  letter-spacing: var(--typ-b-sm-t);
  font-weight: var(--typ-b-sm-w);
}

/* Label */
.typ-l-lg {
  font-size: var(--typ-l-lg-s);
  line-height: var(--typ-l-lg-l);
  letter-spacing: var(--typ-l-lg-t);
  font-weight: var(--typ-l-lg-w);
}

.typ-l-md {
  font-size: var(--typ-l-md-s);
  line-height: var(--typ-l-md-l);
  letter-spacing: var(--typ-l-md-t);
  font-weight: var(--typ-l-md-w);
}

.typ-l-sm {
  font-size: var(--typ-l-sm-s);
  line-height: var(--typ-l-sm-l);
  letter-spacing: var(--typ-l-sm-t);
  font-weight: var(--typ-l-sm-w);
}

.bold {
  font-weight: 500;
}

h1.bold, h2.bold, h3.bold,
.typ-d-lg.bold, .typ-d-md.bold, .typ-d-sm.bold {
  font-weight: 600;
  letter-spacing: 0.0175em;
}

.surface-text.normal {
  color: var(--clr-on-sfc);
}

.surface-text.primary {
  color: var(--clr-pri);
}

.surface-text.secondary {
  color: var(--clr-sec);
}

.surface-text.tertiary {
  color: var(--clr-ter);
}

.surface-text.variant {
  color: var(--clr-on-sfc-var);
}

.c-align-center {
  align-content: center !important;
}

.c-align-start {
  align-content: start !important;
}

.c-align-end {
  align-content: end !important;
}

.c-align-flex-start {
  align-content: flex-start !important;
}

.c-align-flex-end {
  align-content: flex-end !important;
}

.c-align-normal {
  align-content: normal !important;
}

.c-align-space-between {
  align-content: space-between !important;
}

.c-align-space-around {
  align-content: space-around !important;
}

.c-align-space-evenly {
  align-content: space-evenly !important;
}

.c-align-stretch {
  align-content: stretch !important;
}

.i-align-normal {
  align-items: normal !important;
}

.i-align-stretch {
  align-items: stretch !important;
}

.i-align-center {
  align-items: center !important;
}

.i-align-start {
  align-items: start !important;
}

.i-align-end {
  align-items: end !important;
}

.i-align-self-start {
  align-items: self-start !important;
}

.i-align-self-end {
  align-items: self-end !important;
}

.i-align-flex-start {
  align-items: flex-start !important;
}

.i-align-flex-end {
  align-items: flex-end !important;
}

.i-align-anchor-center {
  align-items: anchor-center !important;
}

.i-align-baseline {
  align-items: baseline !important;
}

.s-align-auto {
  align-self: auto !important;
}

.s-align-normal {
  align-self: normal !important;
}

.s-align-stretch {
  align-self: stretch !important;
}

.s-align-center {
  align-self: center !important;
}

.s-align-start {
  align-self: start !important;
}

.s-align-end {
  align-self: end !important;
}

.s-align-self-start {
  align-self: self-start !important;
}

.s-align-self-end {
  align-self: self-end !important;
}

.s-align-flex-start {
  align-self: flex-start !important;
}

.s-align-flex-end {
  align-self: flex-end !important;
}

.s-align-anchor-center {
  align-self: anchor-center !important;
}

.s-align-baseline {
  align-self: baseline !important;
}

.c-justify-center {
  justify-content: center !important;
}

.c-justify-start {
  justify-content: start !important;
}

.c-justify-end {
  justify-content: end !important;
}

.c-justify-flex-start {
  justify-content: flex-start !important;
}

.c-justify-flex-end {
  justify-content: flex-end !important;
}

.c-justify-left {
  justify-content: left !important;
}

.c-justify-right {
  justify-content: right !important;
}

.c-justify-normal {
  justify-content: normal !important;
}

.c-justify-space-between {
  justify-content: space-between !important;
}

.c-justify-space-around {
  justify-content: space-around !important;
}

.c-justify-space-evenly {
  justify-content: space-evenly !important;
}

.c-justify-stretch {
  justify-content: stretch !important;
}

.i-justify-normal {
  justify-items: normal !important;
}

.i-justify-stretch {
  justify-items: stretch !important;
}

.i-justify-center {
  justify-items: center !important;
}

.i-justify-start {
  justify-items: start !important;
}

.i-justify-end {
  justify-items: end !important;
}

.i-justify-self-start {
  justify-items: self-start !important;
}

.i-justify-self-end {
  justify-items: self-end !important;
}

.i-justify-left {
  justify-items: left !important;
}

.i-justify-right {
  justify-items: right !important;
}

.i-justify-anchor-center {
  justify-items: anchor-center !important;
}

.i-justify-baseline {
  justify-items: baseline !important;
}

.s-justify-auto {
  justify-self: auto !important;
}

.s-justify-normal {
  justify-self: normal !important;
}

.s-justify-stretch {
  justify-self: stretch !important;
}

.s-justify-center {
  justify-self: center !important;
}

.s-justify-start {
  justify-self: start !important;
}

.s-justify-end {
  justify-self: end !important;
}

.s-justify-self-start {
  justify-self: self-start !important;
}

.s-justify-self-end {
  justify-self: self-end !important;
}

.s-justify-left {
  justify-self: left !important;
}

.s-justify-right {
  justify-self: right !important;
}

.s-justify-anchor-center {
  justify-self: anchor-center !important;
}

.s-justify-baseline {
  justify-self: baseline !important;
}

.v-align-baseline {
  vertical-align: baseline !important;
}

.v-align-sub {
  vertical-align: sub !important;
}

.v-align-super {
  vertical-align: super !important;
}

.v-align-text-top {
  vertical-align: text-top !important;
}

.v-align-text-bottom {
  vertical-align: text-bottom !important;
}

.v-align-middle {
  vertical-align: middle !important;
}

.v-align-top {
  vertical-align: top !important;
}

.v-align-bottom {
  vertical-align: bottom !important;
}

.w-\[16px\] {
  width: 16px !important;
}

.h-\[16px\] {
  height: 16px !important;
}

.sz-\[16px\] {
  width: 16px !important;
  height: 16px !important;
}

.w-\[24px\] {
  width: 24px !important;
}

.h-\[24px\] {
  height: 24px !important;
}

.sz-\[24px\] {
  width: 24px !important;
  height: 24px !important;
}

.w-\[32px\] {
  width: 32px !important;
}

.h-\[32px\] {
  height: 32px !important;
}

.sz-\[32px\] {
  width: 32px !important;
  height: 32px !important;
}

.w-\[48px\] {
  width: 48px !important;
}

.h-\[48px\] {
  height: 48px !important;
}

.sz-\[48px\] {
  width: 48px !important;
  height: 48px !important;
}

.w-\[56px\] {
  width: 56px !important;
}

.h-\[56px\] {
  height: 56px !important;
}

.sz-\[56px\] {
  width: 56px !important;
  height: 56px !important;
}

.w-\[64px\] {
  width: 64px !important;
}

.h-\[64px\] {
  height: 64px !important;
}

.sz-\[64px\] {
  width: 64px !important;
  height: 64px !important;
}

.w-\[80px\] {
  width: 80px !important;
}

.h-\[80px\] {
  height: 80px !important;
}

.sz-\[80px\] {
  width: 80px !important;
  height: 80px !important;
}

.w-\[88px\] {
  width: 88px !important;
}

.h-\[88px\] {
  height: 88px !important;
}

.sz-\[88px\] {
  width: 88px !important;
  height: 88px !important;
}

.w-\[96px\] {
  width: 96px !important;
}

.h-\[96px\] {
  height: 96px !important;
}

.sz-\[96px\] {
  width: 96px !important;
  height: 96px !important;
}

.w-\[128px\] {
  width: 128px !important;
}

.h-\[128px\] {
  height: 128px !important;
}

.sz-\[128px\] {
  width: 128px !important;
  height: 128px !important;
}

.w-\[144px\] {
  width: 144px !important;
}

.h-\[144px\] {
  height: 144px !important;
}

.sz-\[144px\] {
  width: 144px !important;
  height: 144px !important;
}

.w-\[160px\] {
  width: 160px !important;
}

.h-\[160px\] {
  height: 160px !important;
}

.sz-\[160px\] {
  width: 160px !important;
  height: 160px !important;
}

.w-\[192px\] {
  width: 192px !important;
}

.h-\[192px\] {
  height: 192px !important;
}

.sz-\[192px\] {
  width: 192px !important;
  height: 192px !important;
}

.w-\[240px\] {
  width: 240px !important;
}

.h-\[240px\] {
  height: 240px !important;
}

.sz-\[240px\] {
  width: 240px !important;
  height: 240px !important;
}

.w-\[320px\] {
  width: 320px !important;
}

.h-\[320px\] {
  height: 320px !important;
}

.sz-\[320px\] {
  width: 320px !important;
  height: 320px !important;
}

.w-25 {
  width: 25% !important;
}

.h-25 {
  height: 25% !important;
}

.w-33 {
  width: 33.333% !important;
}

.h-33 {
  height: 33.333% !important;
}

.w-50 {
  width: 50% !important;
}

.h-50 {
  height: 50% !important;
}

.w-55 {
  width: 55% !important;
}

.h-55 {
  height: 55% !important;
}

.w-66 {
  width: 66.667% !important;
}

.h-66 {
  height: 66.667% !important;
}

.w-75 {
  width: 75% !important;
}

.h-75 {
  height: 75% !important;
}

.w-100 {
  width: 100% !important;
}

.h-100 {
  height: 100% !important;
}

.vw-25 {
  width: 25vw !important;
}

.vw-50 {
  width: 50vw !important;
}

.vw-75 {
  width: 75vw !important;
}

.vw-100 {
  width: 100vw !important;
}

.vh-25 {
  height: 25vh !important;
}

.vh-50 {
  height: 50vh !important;
}

.vh-75 {
  height: 75vh !important;
}

.vh-100 {
  height: 100vh !important;
}

.w-max\[600px\] {
  max-width: 600px !important;
}

.w-max\[800px\] {
  max-width: 800px !important;
}

.w-max\[1200px\] {
  max-width: 1200px !important;
}

.h-max\[400px\] {
  max-height: 400px !important;
}

.h-max\[600px\] {
  max-height: 600px !important;
}

.h-max\[800px\] {
  max-height: 800px !important;
}

.round {
  border-radius: 50%;
}

.square {
  border-radius: 0;
}

.pill {
  border-radius: 99999px;
}

p.placeholder:empty::before {
  content: var(--zws);
}

.paper {
  color: var(--clr-on-sfc);
  background-color: var(--clr-sfc);
  border-radius: var(--default-borderradius);
  transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
}

.background {
  background-color: var(--clr-sfc-cntr);
}

.elev-1 {
  box-shadow: var(--elev-1);
}

.overflow-hidden {
  overflow: hidden !important;
}

.relative {
  position: relative !important;
}

.absolute {
  position: absolute !important;
}

.static {
  position: static !important;
}

.d-flex {
  display: flex !important;
}

.d-block {
  display: block !important;
}

.d-inline {
  display: inline !important;
}

.d-none {
  display: none !important;
}

.flex-wrap {
  flex-wrap: wrap !important;
}

.flex-col {
  flex-direction: column !important;
}

.flex-col-rev {
  flex-direction: column-reverse !important;
}

.flex-row {
  flex-direction: row !important;
}

.flex-row-rev {
  flex-direction: row-reverse !important;
}

.flex-grow-0 {
  flex-grow: 0 !important;
}

.flex-grow-1 {
  flex-grow: 1 !important;
}

.flex-shrink-0 {
  flex-shrink: 0 !important;
}

.flex-shrink-1 {
  flex-shrink: 1 !important;
}

.flex-auto {
  flex: 1 1 auto !important;
}

.visible {
  visibility: visible !important;
}

.hidden {
  visibility: hidden !important;
}

.collapse {
  visibility: collapse !important;
}

body:has(.appbar.top) {
  padding-top: var(--appbar-height);
}

body:has(.appbar.bottom) {
  padding-bottom: var(--appbar-height);
}

.appbar {
  height: var(--appbar-height);
  background-color: var(--clr-sfc);
  padding: calc((var(--appbar-height) - 48px) / 2) 24px;
  box-sizing: border-box;
  width: 100%;
}
.appbar.top {
  position: fixed;
  top: 0;
}
.appbar.bottom {
  position: fixed;
  bottom: 0;
}

p {
  margin: unset;
  padding-bottom: 0.5em;
}

:not(p) + p {
  padding-top: 0.5em;
}

p:has(+ :not(p)) {
  padding-bottom: 1.5em;
}

button {
  border: 0;
}

.top-right {
  top: 0px;
  right: 0px;
  position: absolute;
}

.btn, .btn.small {
  --height: 2.5;
  --border-width: 0px;
  --icon-dimension: 1.25;
  --leading-and-trailing-space: 1;
  --icon-label-space: .5;
  --square-corner: .75;
  --pressed-corner: .5;
  --line-height: var(--typ-l-lg-l);
  --font-size: var(--typ-l-lg-s);
  --font-weight: var(--typ-l-lg-w);
  --letter-spacing: var(--typ-l-lg-t);
}

.btn.outlined, .btn.small.outlined {
  --border-width: 1px;
}

.btn.icon, .btn.small.icon {
  --icon-dimension: 1.5;
  --leading-and-trailing-space: .5;
}

.btn.icon.narrow, .btn.small.icon.narrow {
  --leading-and-trailing-space: .25;
}

.btn.icon.wide, .btn.small.icon.wide {
  --leading-and-trailing-space: .875;
}

.btn.xsmall {
  --height: 2;
  --border-width: 0px;
  --icon-dimension: 1.25;
  --leading-and-trailing-space: .75;
  --icon-label-space: .5;
  --square-corner: .75;
  --pressed-corner: .5;
  --line-height: var(--typ-l-lg-l);
  --font-size: var(--typ-l-lg-s);
  --font-weight: var(--typ-l-lg-w);
  --letter-spacing: var(--typ-l-lg-t);
}

.btn.xsmall.outlined {
  --border-width: 1px;
}

.btn.xsmall.icon {
  --leading-and-trailing-space: .375;
}

.btn.xsmall.icon.narrow {
  --leading-and-trailing-space: .25;
}

.btn.xsmall.icon.wide {
  --leading-and-trailing-space: .675;
}

.btn.medium {
  --height: 3.5;
  --border-width: 0px;
  --icon-dimension: 1.5;
  --leading-and-trailing-space: 1.5;
  --icon-label-space: .5;
  --square-corner: 1;
  --pressed-corner: .75;
  --line-height: var(--typ-t-md-l);
  --font-size: var(--typ-t-md-s);
  --font-weight: var(--typ-t-md-w);
  --letter-spacing: var(--typ-t-md-t);
}

.btn.medium.outlined {
  --border-width: 1px;
}

.btn.medium.icon {
  --leading-and-trailing-space: 1;
}

.btn.medium.icon.narrow {
  --leading-and-trailing-space: .75;
}

.btn.medium.icon.wide {
  --leading-and-trailing-space: 1.5;
}

.btn.large {
  --height: 6;
  --border-width: 0px;
  --icon-dimension: 2;
  --leading-and-trailing-space: 3;
  --icon-label-space: 1.25;
  --square-corner: 1.75;
  --pressed-corner: 1;
  --line-height: var(--typ-h-sm-l);
  --font-size: var(--typ-h-sm-s);
  --font-weight: var(--typ-h-sm-w);
  --letter-spacing: var(--typ-h-sm-t);
}

.btn.large.outlined {
  --border-width: 2px;
}

.btn.large.icon {
  --leading-and-trailing-space: 2;
}

.btn.large.icon.narrow {
  --leading-and-trailing-space: 1;
}

.btn.large.icon.wide {
  --leading-and-trailing-space: 3;
}

.btn.xlarge {
  --height: 8.5;
  --border-width: 0px;
  --icon-dimension: 2.5;
  --leading-and-trailing-space: 4;
  --icon-label-space: 2;
  --square-corner: 1.75;
  --pressed-corner: 1;
  --line-height: var(--typ-h-lg-l);
  --font-size: var(--typ-h-lg-s);
  --font-weight: var(--typ-h-lg-w);
  --letter-spacing: var(--typ-h-lg-t);
}

.btn.xlarge.outlined {
  --border-width: 3px;
}

.btn.xlarge.icon {
  --leading-and-trailing-space: 3;
}

.btn.xlarge.icon.narrow {
  --leading-and-trailing-space: 2;
}

.btn.xlarge.icon.wide {
  --leading-and-trailing-space: 4.5;
}

.btn, .btn.filled, .btn.filled.primary {
  --content-color: var(--clr-on-pri);
  --container-color: var(--clr-pri);
  --state-color: var(--container-color);
}

.btn.secondary, .btn.filled.secondary {
  --content-color: var(--clr-on-sec);
  --container-color: var(--clr-sec);
}

.btn.tertiary, .btn.filled.tertiary {
  --content-color: var(--clr-on-ter);
  --container-color: var(--clr-ter);
}

.btn[data-selected=False], .btn.filled[data-selected=False] {
  --content-color: var(--clr-on-sfc-var);
  --container-color: var(--clr-sfc-cntr);
}

.btn:enabled:not([aria-disabled=true]):hover, a.btn:hover, .btn.filled:enabled:not([aria-disabled=true]):hover, a.btn.filled:hover {
  --state-color: color-mix(in srgb, var(--container-color), var(--content-color) var(--hover-opacity-percent));
}

.btn:focus, .btn.filled:focus {
  --state-color: color-mix(in srgb, var(--container-color), var(--content-color) var(--focus-opacity-percent));
}

.btn:active, .btn.filled:active {
  --state-color: color-mix(in srgb, var(--container-color), var(--content-color) var(--pressed-opacity-percent));
}

.btn.elevated, .btn.elevated.primary {
  --content-color: var(--clr-pri);
  --container-color: var(--clr-sfc-cntr-low);
  --elevation: --elev-1;
  --state-color: var(--container-color);
}

.btn.elevated[data-selected=True], .btn.elevated.primary[data-selected=True] {
  --content-color: var(--clr-on-pri);
  --container-color: var(--clr-pri);
}

.btn.elevated.secondary {
  --content-color: var(--clr-sec);
}

.btn.elevated.secondary[data-selected=True] {
  --content-color: var(--clr-on-sec);
  --container-color: var(--clr-sec);
}

.btn.elevated.tertiary {
  --content-color: var(--clr-ter);
}

.btn.elevated.tertiary[data-selected=True] {
  --content-color: var(--clr-on-ter);
  --container-color: var(--clr-ter);
}

.btn.elevated:enabled:not([aria-disabled=true]):hover, a.btn.filled:hover {
  --state-color: color-mix(in srgb, var(--container-color), var(--content-color) var(--hover-opacity-percent));
}

.btn.elevated:focus {
  --state-color: color-mix(in srgb, var(--container-color), var(--content-color) var(--focus-opacity-percent));
}

.btn.elevated:active {
  --state-color: color-mix(in srgb, var(--container-color), var(--content-color) var(--pressed-opacity-percent));
}

.btn.tonal, .btn.tonal.secondary {
  --content-color: var(--clr-on-sec-cntr);
  --container-color: var(--clr-sec-cntr);
  --state-color: var(--container-color);
}

.btn.tonal.primary {
  --content-color: var(--clr-on-pri-cntr);
  --container-color: var(--clr-pri-cntr);
}

.btn.tonal.tertiary {
  --content-color: var(--clr-on-ter-cntr);
  --container-color: var(--clr-ter-cntr);
}

.btn.tonal[data-selected=True], .btn.tonal.secondary[data-selected=True] {
  --content-color: var(--clr-on-sec);
  --container-color: var(--clr-sec);
}

.btn.tonal.primary[data-selected=True] {
  --content-color: var(--clr-on-pri);
  --container-color: var(--clr-pri);
}

.btn.tonal.tertiary[data-selected=True] {
  --content-color: var(--clr-on-ter);
  --container-color: var(--clr-ter);
}

.btn.tonal:enabled:not([aria-disabled=true]):hover, a.btn.tonal:hover {
  --state-color: color-mix(in srgb, var(--container-color), var(--content-color) var(--hover-opacity-percent));
}

.btn.tonal:focus {
  --state-color: color-mix(in srgb, var(--container-color), var(--content-color) var(--focus-opacity-percent));
}

.btn.tonal:active {
  --state-color: color-mix(in srgb, var(--container-color), var(--content-color) var(--pressed-opacity-percent));
}

.btn.elevated:disabled, .btn.elevated[aria-disabled=true], .btn.filled:disabled, .btn.filled[aria-disabled=true], .btn.tonal:disabled, .btn.tonal[aria-disabled=true] {
  --content-color: rgb(from var(--clr-on-sfc) r g b / var(--disabled-opacity-content));
  --container-color: rgb(from var(--clr-on-sfc) r g b / var(--disabled-opacity-container));
  --state-color: var(--container-color);
}

.btn.outlined {
  --content-color: var(--clr-on-sfc-var);
  --container-color: unset;
  --border: var(--border-width) solid var(--clr-outline-var);
  --state-color: var(--container-color);
}

.btn.outlined[data-selected=True] {
  --content-color: var(--clr-inverse-on-sfc);
  --container-color: var(--clr-inverse-sfc);
}

.btn.outlined:enabled:not([aria-disabled=true]):hover, a.btn.outlined:hover {
  --state-color: rgb(from var(--content-color) r g b / var(--hover-opacity));
}

.btn.outlined:enabled:not([aria-disabled=true]):hover[data-selected=True] {
  --state-color: color-mix(in srgb, var(--container-color), var(--content-color) var(--hover-opacity-percent));
}

.btn.outlined:focus {
  --state-color: rgb(from var(--content-color) r g b / var(--focus-opacity));
}

.btn.outlined:focus[data-selected=True] {
  --state-color: color-mix(in srgb, var(--container-color), var(--content-color) var(--focus-opacity-percent));
}

.btn.outlined:active {
  --state-color: rgb(from var(--content-color) r g b / var(--pressed-opacity));
}

.btn.outlined:active:hover[data-selected=True] {
  --state-color: color-mix(in srgb, var(--container-color), var(--content-color) var(--focus-opacity-percent));
}

.btn.outlined:disabled, .btn.outlined[aria-disabled=true] {
  --content-color: rgb(from var(--clr-on-sfc) r g b / var(--disabled-opacity-content));
  --state-color: var(--container-color);
}

.btn.outlined:disabled[data-selected=True], .btn.outlined[aria-disabled=true][data-selected=True] {
  --container-color: rgb(from var(--clr-on-sfc) r g b / var(--disabled-opacity-container));
}

.btn.text, .btn.text.primary {
  --content-color: var(--clr-pri);
  --container-color: unset;
  --state-color: var(--container-color);
}

btn.text.secondary {
  --content-color: var(--clr-sec);
  --container-color: unset;
}

btn.text.tertiary {
  --content-color: var(--clr-ter);
  --container-color: unset;
}

.btn.text:enabled:not([aria-disabled=true]):hover, a.btn.text:hover {
  --state-color: rgb(from var(--content-color) r g b / var(--hover-opacity));
}

.btn.text:focus {
  --state-color: rgb(from var(--content-color) r g b / var(--focus-opacity));
}

.btn.text:active {
  --state-color: rgb(from var(--content-color) r g b / var(--pressed-opacity));
}

.btn.text:disabled, .btn.text[aria-disabled=true] {
  --content-color: rgb(from var(--clr-on-sfc) r g b / var(--disabled-opacity-content));
  --container-color: rgb(from var(--clr-on-sfc) r g b / var(--disabled-opacity-container));
  --state-color: var(--container-color);
}

.btn.text.icon:disabled, .btn.text.icon[aria-disabled=true] {
  --container-color: unset;
}

.btn {
  --box-height: calc(var(--height) * var(--typ-r-s));
  --target-dimension: 48px;
  --v-margin: clamp(0px, calc((var(--target-dimension) - var(--box-height)) / 2 - var(--border-width)), calc(var(--target-dimension) / 2));
  --h-padding: calc(var(--leading-and-trailing-space) * var(--typ-r-s) - var(--border-width));
  height: calc(var(--box-height) - var(--border-width) * 2);
  margin-top: var(--v-margin);
  margin-bottom: var(--v-margin);
  padding: 0;
  padding-left: var(--h-padding);
  padding-right: var(--h-padding);
  position: relative;
  align-items: center;
  justify-content: center;
  display: inline-flex;
  border: none;
  box-sizing: border-box;
  text-decoration: none;
  transition: border-radius 0.2s ease-in-out;
  color: var(--content-color);
  background-color: var(--state-color);
  line-height: var(--line-height);
  font-size: var(--font-size);
  font-weight: var(--font-weight);
  letter-spacing: var(--letter-spacing);
}

.btn.icon {
  --h-margin: clamp(0px, calc((var(--target-dimension) - var(--box-height)) / 2 - var(--border-width)), calc(var(--target-dimension) / 2));
  margin-left: var(--h-margin);
  margin-right: var(--h-margin);
}

.btn.elevated {
  box-shadow: var(--elev-1);
}

.btn.outlined {
  border: var(--border);
}

.btn, .btn.round {
  border-radius: 10000px;
}

.btn[data-selected=True], .btn.round[data-selected=True] {
  border-radius: calc(var(--square-corner) * var(--typ-r-s));
}

.btn.square {
  border-radius: calc(var(--square-corner) * var(--typ-r-s));
}

.btn.square[data-selected=True] {
  border-radius: 10000px;
}

.btn:active:enabled:not([aria-disabled=true]) {
  border-radius: calc(var(--pressed-corner) * var(--typ-r-s));
  transition: none;
}

.btn:focus:enabled:not([aria-disabled=true]) {
  outline: 3px solid var(--clr-sec);
  outline-offset: 2px;
}

.btn .btn-img {
  width: calc(var(--icon-dimension) * var(--typ-r-s));
  height: calc(var(--icon-dimension) * var(--typ-r-s));
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
}

.btn .btn-txt {
  display: inline-flex;
  justify-content: center;
  vertical-align: middle;
  font: inherit;
  text-align: center;
}

.btn .btn-img + .btn-txt {
  padding-left: calc(var(--icon-label-space) * var(--typ-r-s));
}

.crd {
  --border-width: 0px;
  --content-color: var(--clr-on-sfc-variant);
  --border-radius: calc(.75 * var(--typ-r-s));
  --v-padding: var(--typ-r-s);
  --h-padding: var(--typ-r-s);
  --gap: calc(.5 * var(--typ-r-s));
  --icon-dimension: 1.5;
  --icon-color: var(--clr-pri);
  --state-color: var(--container-color);
}

.crd.elevated {
  --container-color: var(--clr-sfc-cntr-low);
  --elevation: var(--elev-1);
  --disabled-container-color: rgb(from var(--clr-on-sfc) r g b / var(--disabled-opacity-content));
  --hovered-elevation: var(--elev-2);
  --dragged-elevation: var(--elev-4);
}

.crd.filled {
  --container-color: var(--clr-sfc-cntr-highest);
  --elevation: var(--elev-0);
  --disabled-container-color: rgb(from var(--clr-sfc-var) r g b / var(--disabled-opacity-content));
  --hovered-elevation: var(--elev-1);
  --dragged-elevation: var(--elev-3);
}

.crd.outlined {
  --container-color: var(--clr-sfc);
  --elevation: var(--elev-0);
  --border-width: 1px;
  --border: var(--border-width) solid var(--clr-outline-var);
  --disabled-container-color: var(--container-color);
  --disabled-border-color: rgb(from var(--clr-outline) r g b / var(--disabled-opacity-outline));
  --hovered-elevation: var(--elev-1);
  --focused-border-color: var(--clr-on-sfc);
  --dragged-elevation: var(--elev-3);
}

.crd:not(.disabled):not([aria-disabled=true]):hover {
  --state-color: color-mix(in srgb, var(--container-color), var(--clr-on-sfc) var(--hover-opacity-percent));
  --elevation: var(--hovered-elevation);
}

.crd:focus {
  --state-color: color-mix(in srgb, var(--container-color), var(--clr-on-sfc) var(--focus-opacity-percent));
}

.crd:active {
  --state-color: color-mix(in srgb, var(--container-color), var(--clr-on-sfc) var(--pressed-opacity-percent));
}

.crd {
  border: none;
  border-radius: var(--border-radius);
  color: var(--content-color);
  background-color: var(--state-color);
  box-shadow: var(--elevation);
  width: fit-content;
  margin: var(--gap);
}

.crd .crd-content {
  padding-top: var(--v-padding);
  padding-bottom: var(--v-padding);
  padding-left: var(--h-padding);
  padding-right: var(--h-padding);
}

.crd.outlined {
  border: var(--border);
}

.crd:focus:not(.disabled):not([aria-disabled=true]) {
  outline: 3px solid var(--clr-sec);
  outline-offset: 2px;
}

.crd:focus:not(.disabled):not([aria-disabled=true]).outlined {
  border-color: var(--focused-border-color);
}

.crd.disabled, .crd[aria-disabled=true] {
  background-color: var(--disabled-container-color);
}

.crd.disabled.outlined, .crd[aria-disabled=true].outlined {
  border-color: var(--disabled-border-color);
}

.crd .crd-icon {
  width: var(--icon-dimension);
  height: var(--icon-dimension);
  color: var(--icon-color);
}

.crd .crd-headline {
  color: var(--clr-on-sfc);
  white-space: nowrap;
}

.crd .crd-subhead {
  color: var(--clr-on-sfc);
  white-space: nowrap;
}

.hover\[75\] {
  opacity: 75%;
}

.hover\[75\]:hover {
  opacity: 100%;
}

.hover\[66\] {
  opacity: 66%;
}

.hover\[66\]:hover {
  opacity: 100%;
}

.fade-pulse {
  animation: fade-frames 2s ease-in-out;
  animation-iteration-count: infinite;
  animation-direction: alternate;
}

@keyframes fade-frames {
  0% {
    opacity: 0.2;
  }
  100% {
    opacity: 1;
  }
}
.radiate-pulse::before {
  content: var(--zws);
  display: block;
  width: 100%;
  height: 100%;
  border: 5px solid currentcolor;
  border-radius: inherit;
  position: absolute;
  top: -5px;
  left: -5px;
  animation: radiate-frames infinite 1.5s;
}

@keyframes radiate-frames {
  0% {
    transform: scale(0.6, 0.6);
    opacity: 1;
  }
  100% {
    transform: scale(1, 1);
    opacity: 0;
  }
}
.mx-auto {
  margin-left: auto !important;
  margin-right: auto !important;
}

.mt-0 {
  margin-top: 0px !important;
}

.mb-0 {
  margin-bottom: 0px !important;
}

.ml-0 {
  margin-left: 0px !important;
}

.mr-0 {
  margin-right: 0px !important;
}

.mx-0 {
  margin-left: 0px !important;
  margin-right: 0px !important;
}

.my-0 {
  margin-top: 0px !important;
  margin-bottom: 0px !important;
}

.ma-0 {
  margin: 0px !important;
}

.mt-0\.25 {
  margin-top: 2px !important;
}

.mb-0\.25 {
  margin-bottom: 2px !important;
}

.ml-0\.25 {
  margin-left: 2px !important;
}

.mr-0\.25 {
  margin-right: 2px !important;
}

.mx-0\.25 {
  margin-left: 2px !important;
  margin-right: 2px !important;
}

.my-0\.25 {
  margin-top: 2px !important;
  margin-bottom: 2px !important;
}

.ma-0\.25 {
  margin: 2px !important;
}

.mt-0\.5 {
  margin-top: 4px !important;
}

.mb-0\.5 {
  margin-bottom: 4px !important;
}

.ml-0\.5 {
  margin-left: 4px !important;
}

.mr-0\.5 {
  margin-right: 4px !important;
}

.mx-0\.5 {
  margin-left: 4px !important;
  margin-right: 4px !important;
}

.my-0\.5 {
  margin-top: 4px !important;
  margin-bottom: 4px !important;
}

.ma-0\.5 {
  margin: 4px !important;
}

.mt-1 {
  margin-top: 8px !important;
}

.mb-1 {
  margin-bottom: 8px !important;
}

.ml-1 {
  margin-left: 8px !important;
}

.mr-1 {
  margin-right: 8px !important;
}

.mx-1 {
  margin-left: 8px !important;
  margin-right: 8px !important;
}

.my-1 {
  margin-top: 8px !important;
  margin-bottom: 8px !important;
}

.ma-1 {
  margin: 8px !important;
}

.mt-1\.5 {
  margin-top: 12px !important;
}

.mb-1\.5 {
  margin-bottom: 12px !important;
}

.ml-1\.5 {
  margin-left: 12px !important;
}

.mr-1\.5 {
  margin-right: 12px !important;
}

.mx-1\.5 {
  margin-left: 12px !important;
  margin-right: 12px !important;
}

.my-1\.5 {
  margin-top: 12px !important;
  margin-bottom: 12px !important;
}

.ma-1\.5 {
  margin: 12px !important;
}

.mt-2 {
  margin-top: 16px !important;
}

.mb-2 {
  margin-bottom: 16px !important;
}

.ml-2 {
  margin-left: 16px !important;
}

.mr-2 {
  margin-right: 16px !important;
}

.mx-2 {
  margin-left: 16px !important;
  margin-right: 16px !important;
}

.my-2 {
  margin-top: 16px !important;
  margin-bottom: 16px !important;
}

.ma-2 {
  margin: 16px !important;
}

.mt-3 {
  margin-top: 24px !important;
}

.mb-3 {
  margin-bottom: 24px !important;
}

.ml-3 {
  margin-left: 24px !important;
}

.mr-3 {
  margin-right: 24px !important;
}

.mx-3 {
  margin-left: 24px !important;
  margin-right: 24px !important;
}

.my-3 {
  margin-top: 24px !important;
  margin-bottom: 24px !important;
}

.ma-3 {
  margin: 24px !important;
}

.mt-4 {
  margin-top: 32px !important;
}

.mb-4 {
  margin-bottom: 32px !important;
}

.ml-4 {
  margin-left: 32px !important;
}

.mr-4 {
  margin-right: 32px !important;
}

.mx-4 {
  margin-left: 32px !important;
  margin-right: 32px !important;
}

.my-4 {
  margin-top: 32px !important;
  margin-bottom: 32px !important;
}

.ma-4 {
  margin: 32px !important;
}

.mt-6 {
  margin-top: 48px !important;
}

.mb-6 {
  margin-bottom: 48px !important;
}

.ml-6 {
  margin-left: 48px !important;
}

.mr-6 {
  margin-right: 48px !important;
}

.mx-6 {
  margin-left: 48px !important;
  margin-right: 48px !important;
}

.my-6 {
  margin-top: 48px !important;
  margin-bottom: 48px !important;
}

.ma-6 {
  margin: 48px !important;
}

.mt-12 {
  margin-top: 96px !important;
}

.mb-12 {
  margin-bottom: 96px !important;
}

.ml-12 {
  margin-left: 96px !important;
}

.mr-12 {
  margin-right: 96px !important;
}

.mx-12 {
  margin-left: 96px !important;
  margin-right: 96px !important;
}

.my-12 {
  margin-top: 96px !important;
  margin-bottom: 96px !important;
}

.ma-12 {
  margin: 96px !important;
}

.mt-24 {
  margin-top: 192px !important;
}

.mb-24 {
  margin-bottom: 192px !important;
}

.ml-24 {
  margin-left: 192px !important;
}

.mr-24 {
  margin-right: 192px !important;
}

.mx-24 {
  margin-left: 192px !important;
  margin-right: 192px !important;
}

.my-24 {
  margin-top: 192px !important;
  margin-bottom: 192px !important;
}

.ma-24 {
  margin: 192px !important;
}

.pt-0 {
  padding-top: 0px !important;
}

.pb-0 {
  padding-bottom: 0px !important;
}

.pl-0 {
  padding-left: 0px !important;
}

.pr-0 {
  padding-right: 0px !important;
}

.px-0 {
  padding-left: 0px !important;
  padding-right: 0px !important;
}

.py-0 {
  padding-top: 0px !important;
  padding-bottom: 0px !important;
}

.pa-0 {
  padding: 0px !important;
}

.pt-0\.25 {
  padding-top: 2px !important;
}

.pb-0\.25 {
  padding-bottom: 2px !important;
}

.pl-0\.25 {
  padding-left: 2px !important;
}

.pr-0\.25 {
  padding-right: 2px !important;
}

.px-0\.25 {
  padding-left: 2px !important;
  padding-right: 2px !important;
}

.py-0\.25 {
  padding-top: 2px !important;
  padding-bottom: 2px !important;
}

.pa-0\.25 {
  padding: 2px !important;
}

.pt-0\.5 {
  padding-top: 4px !important;
}

.pb-0\.5 {
  padding-bottom: 4px !important;
}

.pl-0\.5 {
  padding-left: 4px !important;
}

.pr-0\.5 {
  padding-right: 4px !important;
}

.px-0\.5 {
  padding-left: 4px !important;
  padding-right: 4px !important;
}

.py-0\.5 {
  padding-top: 4px !important;
  padding-bottom: 4px !important;
}

.pa-0\.5 {
  padding: 4px !important;
}

.pt-1 {
  padding-top: 8px !important;
}

.pb-1 {
  padding-bottom: 8px !important;
}

.pl-1 {
  padding-left: 8px !important;
}

.pr-1 {
  padding-right: 8px !important;
}

.px-1 {
  padding-left: 8px !important;
  padding-right: 8px !important;
}

.py-1 {
  padding-top: 8px !important;
  padding-bottom: 8px !important;
}

.pa-1 {
  padding: 8px !important;
}

.pt-1\.5 {
  padding-top: 12px !important;
}

.pb-1\.5 {
  padding-bottom: 12px !important;
}

.pl-1\.5 {
  padding-left: 12px !important;
}

.pr-1\.5 {
  padding-right: 12px !important;
}

.px-1\.5 {
  padding-left: 12px !important;
  padding-right: 12px !important;
}

.py-1\.5 {
  padding-top: 12px !important;
  padding-bottom: 12px !important;
}

.pa-1\.5 {
  padding: 12px !important;
}

.pt-2 {
  padding-top: 16px !important;
}

.pb-2 {
  padding-bottom: 16px !important;
}

.pl-2 {
  padding-left: 16px !important;
}

.pr-2 {
  padding-right: 16px !important;
}

.px-2 {
  padding-left: 16px !important;
  padding-right: 16px !important;
}

.py-2 {
  padding-top: 16px !important;
  padding-bottom: 16px !important;
}

.pa-2 {
  padding: 16px !important;
}

.pt-3 {
  padding-top: 24px !important;
}

.pb-3 {
  padding-bottom: 24px !important;
}

.pl-3 {
  padding-left: 24px !important;
}

.pr-3 {
  padding-right: 24px !important;
}

.px-3 {
  padding-left: 24px !important;
  padding-right: 24px !important;
}

.py-3 {
  padding-top: 24px !important;
  padding-bottom: 24px !important;
}

.pa-3 {
  padding: 24px !important;
}

.pt-4 {
  padding-top: 32px !important;
}

.pb-4 {
  padding-bottom: 32px !important;
}

.pl-4 {
  padding-left: 32px !important;
}

.pr-4 {
  padding-right: 32px !important;
}

.px-4 {
  padding-left: 32px !important;
  padding-right: 32px !important;
}

.py-4 {
  padding-top: 32px !important;
  padding-bottom: 32px !important;
}

.pa-4 {
  padding: 32px !important;
}

.pt-6 {
  padding-top: 48px !important;
}

.pb-6 {
  padding-bottom: 48px !important;
}

.pl-6 {
  padding-left: 48px !important;
}

.pr-6 {
  padding-right: 48px !important;
}

.px-6 {
  padding-left: 48px !important;
  padding-right: 48px !important;
}

.py-6 {
  padding-top: 48px !important;
  padding-bottom: 48px !important;
}

.pa-6 {
  padding: 48px !important;
}

.pt-12 {
  padding-top: 96px !important;
}

.pb-12 {
  padding-bottom: 96px !important;
}

.pl-12 {
  padding-left: 96px !important;
}

.pr-12 {
  padding-right: 96px !important;
}

.px-12 {
  padding-left: 96px !important;
  padding-right: 96px !important;
}

.py-12 {
  padding-top: 96px !important;
  padding-bottom: 96px !important;
}

.pa-12 {
  padding: 96px !important;
}

.pt-24 {
  padding-top: 192px !important;
}

.pb-24 {
  padding-bottom: 192px !important;
}

.pl-24 {
  padding-left: 192px !important;
}

.pr-24 {
  padding-right: 192px !important;
}

.px-24 {
  padding-left: 192px !important;
  padding-right: 192px !important;
}

.py-24 {
  padding-top: 192px !important;
  padding-bottom: 192px !important;
}

.pa-24 {
  padding: 192px !important;
}

@media (width < 600px) {
  :root {
    --appbar-height: 56px;
  }
  body:has(.appbar.top), body:has(.appbar.bottom) {
    padding: 0;
  }
  .appbar.top, .appbar.bottom {
    position: static;
  }
  .mobile\:fill-body {
    margin: 0 !important;
    padding: 0 !important;
    width: 100%;
  }
  .mobile\:fill-body .paper {
    box-shadow: none;
  }
  body:has(.appbar.top) .mobile\:fill-body, body:has(.appbar.bottom) .mobile\:fill-body {
    min-height: calc(100vh - var(--appbar-height));
  }
  body:has(.appbar.top):has(.appbar.bottom) .mobile\:fill-body {
    min-height: calc(100vh - var(--appbar-height) * 2);
  }
  .mobile\:c-align-center {
    align-content: center !important;
  }
  .mobile\:c-align-start {
    align-content: start !important;
  }
  .mobile\:c-align-end {
    align-content: end !important;
  }
  .mobile\:c-align-flex-start {
    align-content: flex-start !important;
  }
  .mobile\:c-align-flex-end {
    align-content: flex-end !important;
  }
  .mobile\:c-align-normal {
    align-content: normal !important;
  }
  .mobile\:c-align-space-between {
    align-content: space-between !important;
  }
  .mobile\:c-align-space-around {
    align-content: space-around !important;
  }
  .mobile\:c-align-space-evenly {
    align-content: space-evenly !important;
  }
  .mobile\:c-align-stretch {
    align-content: stretch !important;
  }
  .mobile\:i-align-normal {
    align-items: normal !important;
  }
  .mobile\:i-align-stretch {
    align-items: stretch !important;
  }
  .mobile\:i-align-center {
    align-items: center !important;
  }
  .mobile\:i-align-start {
    align-items: start !important;
  }
  .mobile\:i-align-end {
    align-items: end !important;
  }
  .mobile\:i-align-self-start {
    align-items: self-start !important;
  }
  .mobile\:i-align-self-end {
    align-items: self-end !important;
  }
  .mobile\:i-align-flex-start {
    align-items: flex-start !important;
  }
  .mobile\:i-align-flex-end {
    align-items: flex-end !important;
  }
  .mobile\:i-align-anchor-center {
    align-items: anchor-center !important;
  }
  .mobile\:i-align-baseline {
    align-items: baseline !important;
  }
  .mobile\:s-align-auto {
    align-self: auto !important;
  }
  .mobile\:s-align-normal {
    align-self: normal !important;
  }
  .mobile\:s-align-stretch {
    align-self: stretch !important;
  }
  .mobile\:s-align-center {
    align-self: center !important;
  }
  .mobile\:s-align-start {
    align-self: start !important;
  }
  .mobile\:s-align-end {
    align-self: end !important;
  }
  .mobile\:s-align-self-start {
    align-self: self-start !important;
  }
  .mobile\:s-align-self-end {
    align-self: self-end !important;
  }
  .mobile\:s-align-flex-start {
    align-self: flex-start !important;
  }
  .mobile\:s-align-flex-end {
    align-self: flex-end !important;
  }
  .mobile\:s-align-anchor-center {
    align-self: anchor-center !important;
  }
  .mobile\:s-align-baseline {
    align-self: baseline !important;
  }
  .mobile\:c-justify-center {
    justify-content: center !important;
  }
  .mobile\:c-justify-start {
    justify-content: start !important;
  }
  .mobile\:c-justify-end {
    justify-content: end !important;
  }
  .mobile\:c-justify-flex-start {
    justify-content: flex-start !important;
  }
  .mobile\:c-justify-flex-end {
    justify-content: flex-end !important;
  }
  .mobile\:c-justify-left {
    justify-content: left !important;
  }
  .mobile\:c-justify-right {
    justify-content: right !important;
  }
  .mobile\:c-justify-normal {
    justify-content: normal !important;
  }
  .mobile\:c-justify-space-between {
    justify-content: space-between !important;
  }
  .mobile\:c-justify-space-around {
    justify-content: space-around !important;
  }
  .mobile\:c-justify-space-evenly {
    justify-content: space-evenly !important;
  }
  .mobile\:c-justify-stretch {
    justify-content: stretch !important;
  }
  .mobile\:i-justify-normal {
    justify-items: normal !important;
  }
  .mobile\:i-justify-stretch {
    justify-items: stretch !important;
  }
  .mobile\:i-justify-center {
    justify-items: center !important;
  }
  .mobile\:i-justify-start {
    justify-items: start !important;
  }
  .mobile\:i-justify-end {
    justify-items: end !important;
  }
  .mobile\:i-justify-self-start {
    justify-items: self-start !important;
  }
  .mobile\:i-justify-self-end {
    justify-items: self-end !important;
  }
  .mobile\:i-justify-left {
    justify-items: left !important;
  }
  .mobile\:i-justify-right {
    justify-items: right !important;
  }
  .mobile\:i-justify-anchor-center {
    justify-items: anchor-center !important;
  }
  .mobile\:i-justify-baseline {
    justify-items: baseline !important;
  }
  .mobile\:s-justify-auto {
    justify-self: auto !important;
  }
  .mobile\:s-justify-normal {
    justify-self: normal !important;
  }
  .mobile\:s-justify-stretch {
    justify-self: stretch !important;
  }
  .mobile\:s-justify-center {
    justify-self: center !important;
  }
  .mobile\:s-justify-start {
    justify-self: start !important;
  }
  .mobile\:s-justify-end {
    justify-self: end !important;
  }
  .mobile\:s-justify-self-start {
    justify-self: self-start !important;
  }
  .mobile\:s-justify-self-end {
    justify-self: self-end !important;
  }
  .mobile\:s-justify-left {
    justify-self: left !important;
  }
  .mobile\:s-justify-right {
    justify-self: right !important;
  }
  .mobile\:s-justify-anchor-center {
    justify-self: anchor-center !important;
  }
  .mobile\:s-justify-baseline {
    justify-self: baseline !important;
  }
  .mobile\:v-align-baseline {
    vertical-align: baseline !important;
  }
  .mobile\:v-align-sub {
    vertical-align: sub !important;
  }
  .mobile\:v-align-super {
    vertical-align: super !important;
  }
  .mobile\:v-align-text-top {
    vertical-align: text-top !important;
  }
  .mobile\:v-align-text-bottom {
    vertical-align: text-bottom !important;
  }
  .mobile\:v-align-middle {
    vertical-align: middle !important;
  }
  .mobile\:v-align-top {
    vertical-align: top !important;
  }
  .mobile\:v-align-bottom {
    vertical-align: bottom !important;
  }
  .mobile\:overflow-hidden {
    overflow: hidden !important;
  }
  .mobile\:relative {
    position: relative !important;
  }
  .mobile\:absolute {
    position: absolute !important;
  }
  .mobile\:static {
    position: static !important;
  }
  .mobile\:d-flex {
    display: flex !important;
  }
  .mobile\:d-block {
    display: block !important;
  }
  .mobile\:d-inline {
    display: inline !important;
  }
  .mobile\:d-none {
    display: none !important;
  }
  .mobile\:flex-wrap {
    flex-wrap: wrap !important;
  }
  .mobile\:flex-col {
    flex-direction: column !important;
  }
  .mobile\:flex-col-rev {
    flex-direction: column-reverse !important;
  }
  .mobile\:flex-row {
    flex-direction: row !important;
  }
  .mobile\:flex-row-rev {
    flex-direction: row-reverse !important;
  }
  .mobile\:flex-grow-0 {
    flex-grow: 0 !important;
  }
  .mobile\:flex-grow-1 {
    flex-grow: 1 !important;
  }
  .mobile\:flex-shrink-0 {
    flex-shrink: 0 !important;
  }
  .mobile\:flex-shrink-1 {
    flex-shrink: 1 !important;
  }
  .mobile\:flex-auto {
    flex: 1 1 auto !important;
  }
  .mobile\:visible {
    visibility: visible !important;
  }
  .mobile\:hidden {
    visibility: hidden !important;
  }
  .mobile\:collapse {
    visibility: collapse !important;
  }
  .mobile\:mx-auto {
    margin-left: auto !important;
    margin-right: auto !important;
  }
  .mobile\:mt-0 {
    margin-top: 0px !important;
  }
  .mobile\:mb-0 {
    margin-bottom: 0px !important;
  }
  .mobile\:ml-0 {
    margin-left: 0px !important;
  }
  .mobile\:mr-0 {
    margin-right: 0px !important;
  }
  .mobile\:mx-0 {
    margin-left: 0px !important;
    margin-right: 0px !important;
  }
  .mobile\:my-0 {
    margin-top: 0px !important;
    margin-bottom: 0px !important;
  }
  .mobile\:ma-0 {
    margin: 0px !important;
  }
  .mobile\:mt-0\.25 {
    margin-top: 2px !important;
  }
  .mobile\:mb-0\.25 {
    margin-bottom: 2px !important;
  }
  .mobile\:ml-0\.25 {
    margin-left: 2px !important;
  }
  .mobile\:mr-0\.25 {
    margin-right: 2px !important;
  }
  .mobile\:mx-0\.25 {
    margin-left: 2px !important;
    margin-right: 2px !important;
  }
  .mobile\:my-0\.25 {
    margin-top: 2px !important;
    margin-bottom: 2px !important;
  }
  .mobile\:ma-0\.25 {
    margin: 2px !important;
  }
  .mobile\:mt-0\.5 {
    margin-top: 4px !important;
  }
  .mobile\:mb-0\.5 {
    margin-bottom: 4px !important;
  }
  .mobile\:ml-0\.5 {
    margin-left: 4px !important;
  }
  .mobile\:mr-0\.5 {
    margin-right: 4px !important;
  }
  .mobile\:mx-0\.5 {
    margin-left: 4px !important;
    margin-right: 4px !important;
  }
  .mobile\:my-0\.5 {
    margin-top: 4px !important;
    margin-bottom: 4px !important;
  }
  .mobile\:ma-0\.5 {
    margin: 4px !important;
  }
  .mobile\:mt-1 {
    margin-top: 8px !important;
  }
  .mobile\:mb-1 {
    margin-bottom: 8px !important;
  }
  .mobile\:ml-1 {
    margin-left: 8px !important;
  }
  .mobile\:mr-1 {
    margin-right: 8px !important;
  }
  .mobile\:mx-1 {
    margin-left: 8px !important;
    margin-right: 8px !important;
  }
  .mobile\:my-1 {
    margin-top: 8px !important;
    margin-bottom: 8px !important;
  }
  .mobile\:ma-1 {
    margin: 8px !important;
  }
  .mobile\:mt-1\.5 {
    margin-top: 12px !important;
  }
  .mobile\:mb-1\.5 {
    margin-bottom: 12px !important;
  }
  .mobile\:ml-1\.5 {
    margin-left: 12px !important;
  }
  .mobile\:mr-1\.5 {
    margin-right: 12px !important;
  }
  .mobile\:mx-1\.5 {
    margin-left: 12px !important;
    margin-right: 12px !important;
  }
  .mobile\:my-1\.5 {
    margin-top: 12px !important;
    margin-bottom: 12px !important;
  }
  .mobile\:ma-1\.5 {
    margin: 12px !important;
  }
  .mobile\:mt-2 {
    margin-top: 16px !important;
  }
  .mobile\:mb-2 {
    margin-bottom: 16px !important;
  }
  .mobile\:ml-2 {
    margin-left: 16px !important;
  }
  .mobile\:mr-2 {
    margin-right: 16px !important;
  }
  .mobile\:mx-2 {
    margin-left: 16px !important;
    margin-right: 16px !important;
  }
  .mobile\:my-2 {
    margin-top: 16px !important;
    margin-bottom: 16px !important;
  }
  .mobile\:ma-2 {
    margin: 16px !important;
  }
  .mobile\:mt-3 {
    margin-top: 24px !important;
  }
  .mobile\:mb-3 {
    margin-bottom: 24px !important;
  }
  .mobile\:ml-3 {
    margin-left: 24px !important;
  }
  .mobile\:mr-3 {
    margin-right: 24px !important;
  }
  .mobile\:mx-3 {
    margin-left: 24px !important;
    margin-right: 24px !important;
  }
  .mobile\:my-3 {
    margin-top: 24px !important;
    margin-bottom: 24px !important;
  }
  .mobile\:ma-3 {
    margin: 24px !important;
  }
  .mobile\:mt-4 {
    margin-top: 32px !important;
  }
  .mobile\:mb-4 {
    margin-bottom: 32px !important;
  }
  .mobile\:ml-4 {
    margin-left: 32px !important;
  }
  .mobile\:mr-4 {
    margin-right: 32px !important;
  }
  .mobile\:mx-4 {
    margin-left: 32px !important;
    margin-right: 32px !important;
  }
  .mobile\:my-4 {
    margin-top: 32px !important;
    margin-bottom: 32px !important;
  }
  .mobile\:ma-4 {
    margin: 32px !important;
  }
  .mobile\:mt-6 {
    margin-top: 48px !important;
  }
  .mobile\:mb-6 {
    margin-bottom: 48px !important;
  }
  .mobile\:ml-6 {
    margin-left: 48px !important;
  }
  .mobile\:mr-6 {
    margin-right: 48px !important;
  }
  .mobile\:mx-6 {
    margin-left: 48px !important;
    margin-right: 48px !important;
  }
  .mobile\:my-6 {
    margin-top: 48px !important;
    margin-bottom: 48px !important;
  }
  .mobile\:ma-6 {
    margin: 48px !important;
  }
  .mobile\:mt-12 {
    margin-top: 96px !important;
  }
  .mobile\:mb-12 {
    margin-bottom: 96px !important;
  }
  .mobile\:ml-12 {
    margin-left: 96px !important;
  }
  .mobile\:mr-12 {
    margin-right: 96px !important;
  }
  .mobile\:mx-12 {
    margin-left: 96px !important;
    margin-right: 96px !important;
  }
  .mobile\:my-12 {
    margin-top: 96px !important;
    margin-bottom: 96px !important;
  }
  .mobile\:ma-12 {
    margin: 96px !important;
  }
  .mobile\:mt-24 {
    margin-top: 192px !important;
  }
  .mobile\:mb-24 {
    margin-bottom: 192px !important;
  }
  .mobile\:ml-24 {
    margin-left: 192px !important;
  }
  .mobile\:mr-24 {
    margin-right: 192px !important;
  }
  .mobile\:mx-24 {
    margin-left: 192px !important;
    margin-right: 192px !important;
  }
  .mobile\:my-24 {
    margin-top: 192px !important;
    margin-bottom: 192px !important;
  }
  .mobile\:ma-24 {
    margin: 192px !important;
  }
  .mobile\:pt-0 {
    padding-top: 0px !important;
  }
  .mobile\:pb-0 {
    padding-bottom: 0px !important;
  }
  .mobile\:pl-0 {
    padding-left: 0px !important;
  }
  .mobile\:pr-0 {
    padding-right: 0px !important;
  }
  .mobile\:px-0 {
    padding-left: 0px !important;
    padding-right: 0px !important;
  }
  .mobile\:py-0 {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
  }
  .mobile\:pa-0 {
    padding: 0px !important;
  }
  .mobile\:pt-0\.25 {
    padding-top: 2px !important;
  }
  .mobile\:pb-0\.25 {
    padding-bottom: 2px !important;
  }
  .mobile\:pl-0\.25 {
    padding-left: 2px !important;
  }
  .mobile\:pr-0\.25 {
    padding-right: 2px !important;
  }
  .mobile\:px-0\.25 {
    padding-left: 2px !important;
    padding-right: 2px !important;
  }
  .mobile\:py-0\.25 {
    padding-top: 2px !important;
    padding-bottom: 2px !important;
  }
  .mobile\:pa-0\.25 {
    padding: 2px !important;
  }
  .mobile\:pt-0\.5 {
    padding-top: 4px !important;
  }
  .mobile\:pb-0\.5 {
    padding-bottom: 4px !important;
  }
  .mobile\:pl-0\.5 {
    padding-left: 4px !important;
  }
  .mobile\:pr-0\.5 {
    padding-right: 4px !important;
  }
  .mobile\:px-0\.5 {
    padding-left: 4px !important;
    padding-right: 4px !important;
  }
  .mobile\:py-0\.5 {
    padding-top: 4px !important;
    padding-bottom: 4px !important;
  }
  .mobile\:pa-0\.5 {
    padding: 4px !important;
  }
  .mobile\:pt-1 {
    padding-top: 8px !important;
  }
  .mobile\:pb-1 {
    padding-bottom: 8px !important;
  }
  .mobile\:pl-1 {
    padding-left: 8px !important;
  }
  .mobile\:pr-1 {
    padding-right: 8px !important;
  }
  .mobile\:px-1 {
    padding-left: 8px !important;
    padding-right: 8px !important;
  }
  .mobile\:py-1 {
    padding-top: 8px !important;
    padding-bottom: 8px !important;
  }
  .mobile\:pa-1 {
    padding: 8px !important;
  }
  .mobile\:pt-1\.5 {
    padding-top: 12px !important;
  }
  .mobile\:pb-1\.5 {
    padding-bottom: 12px !important;
  }
  .mobile\:pl-1\.5 {
    padding-left: 12px !important;
  }
  .mobile\:pr-1\.5 {
    padding-right: 12px !important;
  }
  .mobile\:px-1\.5 {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
  .mobile\:py-1\.5 {
    padding-top: 12px !important;
    padding-bottom: 12px !important;
  }
  .mobile\:pa-1\.5 {
    padding: 12px !important;
  }
  .mobile\:pt-2 {
    padding-top: 16px !important;
  }
  .mobile\:pb-2 {
    padding-bottom: 16px !important;
  }
  .mobile\:pl-2 {
    padding-left: 16px !important;
  }
  .mobile\:pr-2 {
    padding-right: 16px !important;
  }
  .mobile\:px-2 {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
  .mobile\:py-2 {
    padding-top: 16px !important;
    padding-bottom: 16px !important;
  }
  .mobile\:pa-2 {
    padding: 16px !important;
  }
  .mobile\:pt-3 {
    padding-top: 24px !important;
  }
  .mobile\:pb-3 {
    padding-bottom: 24px !important;
  }
  .mobile\:pl-3 {
    padding-left: 24px !important;
  }
  .mobile\:pr-3 {
    padding-right: 24px !important;
  }
  .mobile\:px-3 {
    padding-left: 24px !important;
    padding-right: 24px !important;
  }
  .mobile\:py-3 {
    padding-top: 24px !important;
    padding-bottom: 24px !important;
  }
  .mobile\:pa-3 {
    padding: 24px !important;
  }
  .mobile\:pt-4 {
    padding-top: 32px !important;
  }
  .mobile\:pb-4 {
    padding-bottom: 32px !important;
  }
  .mobile\:pl-4 {
    padding-left: 32px !important;
  }
  .mobile\:pr-4 {
    padding-right: 32px !important;
  }
  .mobile\:px-4 {
    padding-left: 32px !important;
    padding-right: 32px !important;
  }
  .mobile\:py-4 {
    padding-top: 32px !important;
    padding-bottom: 32px !important;
  }
  .mobile\:pa-4 {
    padding: 32px !important;
  }
  .mobile\:pt-6 {
    padding-top: 48px !important;
  }
  .mobile\:pb-6 {
    padding-bottom: 48px !important;
  }
  .mobile\:pl-6 {
    padding-left: 48px !important;
  }
  .mobile\:pr-6 {
    padding-right: 48px !important;
  }
  .mobile\:px-6 {
    padding-left: 48px !important;
    padding-right: 48px !important;
  }
  .mobile\:py-6 {
    padding-top: 48px !important;
    padding-bottom: 48px !important;
  }
  .mobile\:pa-6 {
    padding: 48px !important;
  }
  .mobile\:pt-12 {
    padding-top: 96px !important;
  }
  .mobile\:pb-12 {
    padding-bottom: 96px !important;
  }
  .mobile\:pl-12 {
    padding-left: 96px !important;
  }
  .mobile\:pr-12 {
    padding-right: 96px !important;
  }
  .mobile\:px-12 {
    padding-left: 96px !important;
    padding-right: 96px !important;
  }
  .mobile\:py-12 {
    padding-top: 96px !important;
    padding-bottom: 96px !important;
  }
  .mobile\:pa-12 {
    padding: 96px !important;
  }
  .mobile\:pt-24 {
    padding-top: 192px !important;
  }
  .mobile\:pb-24 {
    padding-bottom: 192px !important;
  }
  .mobile\:pl-24 {
    padding-left: 192px !important;
  }
  .mobile\:pr-24 {
    padding-right: 192px !important;
  }
  .mobile\:px-24 {
    padding-left: 192px !important;
    padding-right: 192px !important;
  }
  .mobile\:py-24 {
    padding-top: 192px !important;
    padding-bottom: 192px !important;
  }
  .mobile\:pa-24 {
    padding: 192px !important;
  }
  .mobile\:w-\[16px\] {
    width: 16px !important;
  }
  .mobile\:h-\[16px\] {
    height: 16px !important;
  }
  .mobile\:sz-\[16px\] {
    width: 16px !important;
    height: 16px !important;
  }
  .mobile\:w-\[24px\] {
    width: 24px !important;
  }
  .mobile\:h-\[24px\] {
    height: 24px !important;
  }
  .mobile\:sz-\[24px\] {
    width: 24px !important;
    height: 24px !important;
  }
  .mobile\:w-\[32px\] {
    width: 32px !important;
  }
  .mobile\:h-\[32px\] {
    height: 32px !important;
  }
  .mobile\:sz-\[32px\] {
    width: 32px !important;
    height: 32px !important;
  }
  .mobile\:w-\[48px\] {
    width: 48px !important;
  }
  .mobile\:h-\[48px\] {
    height: 48px !important;
  }
  .mobile\:sz-\[48px\] {
    width: 48px !important;
    height: 48px !important;
  }
  .mobile\:w-\[56px\] {
    width: 56px !important;
  }
  .mobile\:h-\[56px\] {
    height: 56px !important;
  }
  .mobile\:sz-\[56px\] {
    width: 56px !important;
    height: 56px !important;
  }
  .mobile\:w-\[64px\] {
    width: 64px !important;
  }
  .mobile\:h-\[64px\] {
    height: 64px !important;
  }
  .mobile\:sz-\[64px\] {
    width: 64px !important;
    height: 64px !important;
  }
  .mobile\:w-\[80px\] {
    width: 80px !important;
  }
  .mobile\:h-\[80px\] {
    height: 80px !important;
  }
  .mobile\:sz-\[80px\] {
    width: 80px !important;
    height: 80px !important;
  }
  .mobile\:w-\[88px\] {
    width: 88px !important;
  }
  .mobile\:h-\[88px\] {
    height: 88px !important;
  }
  .mobile\:sz-\[88px\] {
    width: 88px !important;
    height: 88px !important;
  }
  .mobile\:w-\[96px\] {
    width: 96px !important;
  }
  .mobile\:h-\[96px\] {
    height: 96px !important;
  }
  .mobile\:sz-\[96px\] {
    width: 96px !important;
    height: 96px !important;
  }
  .mobile\:w-\[128px\] {
    width: 128px !important;
  }
  .mobile\:h-\[128px\] {
    height: 128px !important;
  }
  .mobile\:sz-\[128px\] {
    width: 128px !important;
    height: 128px !important;
  }
  .mobile\:w-\[144px\] {
    width: 144px !important;
  }
  .mobile\:h-\[144px\] {
    height: 144px !important;
  }
  .mobile\:sz-\[144px\] {
    width: 144px !important;
    height: 144px !important;
  }
  .mobile\:w-\[160px\] {
    width: 160px !important;
  }
  .mobile\:h-\[160px\] {
    height: 160px !important;
  }
  .mobile\:sz-\[160px\] {
    width: 160px !important;
    height: 160px !important;
  }
  .mobile\:w-\[192px\] {
    width: 192px !important;
  }
  .mobile\:h-\[192px\] {
    height: 192px !important;
  }
  .mobile\:sz-\[192px\] {
    width: 192px !important;
    height: 192px !important;
  }
  .mobile\:w-\[240px\] {
    width: 240px !important;
  }
  .mobile\:h-\[240px\] {
    height: 240px !important;
  }
  .mobile\:sz-\[240px\] {
    width: 240px !important;
    height: 240px !important;
  }
  .mobile\:w-\[320px\] {
    width: 320px !important;
  }
  .mobile\:h-\[320px\] {
    height: 320px !important;
  }
  .mobile\:sz-\[320px\] {
    width: 320px !important;
    height: 320px !important;
  }
  .mobile\:w-25 {
    width: 25% !important;
  }
  .mobile\:h-25 {
    height: 25% !important;
  }
  .mobile\:w-33 {
    width: 33.333% !important;
  }
  .mobile\:h-33 {
    height: 33.333% !important;
  }
  .mobile\:w-50 {
    width: 50% !important;
  }
  .mobile\:h-50 {
    height: 50% !important;
  }
  .mobile\:w-55 {
    width: 55% !important;
  }
  .mobile\:h-55 {
    height: 55% !important;
  }
  .mobile\:w-66 {
    width: 66.667% !important;
  }
  .mobile\:h-66 {
    height: 66.667% !important;
  }
  .mobile\:w-75 {
    width: 75% !important;
  }
  .mobile\:h-75 {
    height: 75% !important;
  }
  .mobile\:w-100 {
    width: 100% !important;
  }
  .mobile\:h-100 {
    height: 100% !important;
  }
  .mobile\:vw-25 {
    width: 25vw !important;
  }
  .mobile\:vw-50 {
    width: 50vw !important;
  }
  .mobile\:vw-75 {
    width: 75vw !important;
  }
  .mobile\:vw-100 {
    width: 100vw !important;
  }
  .mobile\:vh-25 {
    height: 25vh !important;
  }
  .mobile\:vh-50 {
    height: 50vh !important;
  }
  .mobile\:vh-75 {
    height: 75vh !important;
  }
  .mobile\:vh-100 {
    height: 100vh !important;
  }
  .mobile\:w-max\[600px\] {
    max-width: 600px !important;
  }
  .mobile\:w-max\[800px\] {
    max-width: 800px !important;
  }
  .mobile\:w-max\[1200px\] {
    max-width: 1200px !important;
  }
  .mobile\:h-max\[400px\] {
    max-height: 400px !important;
  }
  .mobile\:h-max\[600px\] {
    max-height: 600px !important;
  }
  .mobile\:h-max\[800px\] {
    max-height: 800px !important;
  }
}