:root {
  --size-xsmall:.25rem;
  --size-small:.5rem;
  --size-normal:1rem;
  --size-large:2rem;
  --heig-25--vh:25vh;
  --heig-75--vh:75vh;
  --grid-template--4:
          repeat(4, 1fr);
  --grid-4: 1/5;
  --grid-temaplate--8: repeat(8, 1fr);
  --grid-8: 1/9;
  --grid-9: 1/10;
  --grid-template--12: repeat(12, 1fr);
  --grid-12: 1/13;
}

.w-full {
  width: 100%;
}
.w-20px {
  width: 20px;
}
.w-40px {
  width: 40px;
}

.h-56px {
  height: 56px;
  min-height: 56px;
  max-height: 56px;
}
.h-180px {
  height: 180px;
  min-height: 180px;
  max-height: 180px;
}

.wh-24px {
  width: 24px;
  height: 24px;
}
.wh-40px {
  width: 40px;
  height: 40px;
}

.min-w-236px {
  min-width: 236px;
}
.min-w-640px {
  max-width: 640px;
}
.min-h-100dvh {
  min-height: 100dvh;
}

.mgn-l-1--rem {
  margin-left: 1rem;
}
.mgn-l-4--px {
  margin-left: 4px;
}
.mgn-l-12--px {
  margin-left: 12px;
}
.mgn-l-16--px {
  margin-left: 16px;
}
.mgn-t-6--px {
  margin-top: 6px;
}
.mgn-b-12--px {
  margin-bottom: 12px;
}
.mgn-b-25--px {
  margin-bottom: 25px;
}
.mgn-b-14--px {
  margin-bottom: 14px;
}
.mgn-b-16--px {
  margin-bottom: 16px;
}

.pdg-0 {
  padding: 0;
}
.pdg--12-px {
  padding-bottom: 12px;
}
.pdg-hor--small {
  padding: 0 var(--size-small);
}
.pdg-hor--normal {
  padding: 0 var(--size-normal);
}
.pdg-hor--large {
  padding: 0 var(--size-large);
}
.pdg-xsmall, .pdg-xsmall--fixed {
  padding: var(--size-xsmall);
}
.pdg-small, .pdg-small--fixed {
  padding: var(--size-small);
}
.pdg-normal, .pdg-normal--fixed {
  padding: var(--size-normal);
}
.pdg-large, .pdg-large--fixed {
  padding: var(--size-large);
}
.pdg-b--6-px {
  padding-bottom: 6px;
}
.pdg-b--16-px {
  padding-bottom: 16px;
}
.pdg-b--64-px {
  padding-bottom: 64px;
}
.pdg-t-b--small {
  padding: var(--size-small) 0;
}
.pdg-t-b--normal {
  padding: var(--size-normal) 0;
}
.pdg-t-b--large {
  padding: var(--size-large) 0;
}
.pdg-t-b--16-px {
  padding-top: 16px;
  padding-bottom: 16px;
}
.pdg-t-b--24-px {
  padding-top: 24px;
  padding-bottom: 24px;
}
.pdg-t-b--32-px {
  padding-top: 32px;
  padding-bottom: 32px;
}
.pdg-t-b--64-px {
  padding-top: 64px;
  padding-bottom: 64px;
}
.pdg-l {
  padding-left: 48px;
}
.pdg-l-r--8px {
  padding-right: 8px;
  padding-left: 8px;
}
.pdg-l-r--16px {
  padding-right: 16px;
  padding-left: 16px;
}
.pdg-l-r--12px {
  padding-right: 12px;
  padding-left: 12px;
}

.hidden {
  display: none !important;
}
.hidden-opacity {
  opacity: 0 !important;
}

.overflow-scroll {
  overflow: scroll;
}
.overflow-scroll--y {
  overflow-y: auto;
}

.root {
  display: flex;
  flex-direction: column;
}

.grid {
  display: grid;
}

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

.flex {
  display: flex;
}
.flex-0 {
  flex: 0;
}
.flex-1 {
  flex: 1;
}
.flex-2 {
  flex: 2;
}
.flex-3 {
  flex: 3;
}
.flex-4 {
  flex: 4;
}
.flex-5 {
  flex: 5;
}
.flex-6 {
  flex: 6;
}
.flex-7 {
  flex: 7;
}
.flex-8 {
  flex: 8;
}
.flex-9 {
  flex: 9;
}
.flex-10 {
  flex: 10;
}
.flex-11 {
  flex: 11;
}
.flex-12 {
  flex: 12;
}

.dire-row {
  flex-direction: row;
}
.dire-row--rev {
  flex-direction: row-reverse;
}
.dire-col {
  flex-direction: column;
}
.dire-col--reverse {
  flex-direction: column-reverse;
}

.wrap {
  flex-wrap: wrap;
}
.wrap-nowrap {
  flex-wrap: nowrap;
}

.flow-row {
  flex-flow: row wrap;
}
.flow-column {
  flex-flow: column wrap;
}

.just-cont--start {
  justify-content: flex-start;
}
.just-cont--center {
  justify-content: center;
}
.just-cont--end {
  justify-content: end;
}
.just-cont--space-even {
  justify-content: space-evenly;
}
.just-cont--space-betw {
  justify-content: space-between;
}

.ali-items--start {
  align-items: flex-start;
}
.ali-items--center {
  align-items: center;
}
.ali-items--end {
  align-items: flex-end;
}
.ali-items-stret {
  align-items: stretch;
}
.ali-items--start-after-end {
  align-items: start;
}

.ali-self--start {
  align-self: flex-start;
}
.ali-self--center {
  align-self: center;
}
.ali-self--end {
  align-self: flex-end;
}

.row-after-column {
  flex-direction: row;
}

.column-after-row {
  flex-direction: column;
}
.column-before-reverse {
  flex-direction: column-reverse;
}

.content-start-after-end {
  justify-content: start;
}
.content-end-after-start {
  justify-content: end;
}

.gap-025--rem {
  gap: 0.25rem;
}
.gap-05--rem {
  gap: 0.5rem;
}
.gap-1--rem {
  gap: 1rem;
}
.gap-1-25--rem {
  gap: 1.25rem;
}
.gap-1-5--rem {
  gap: 1.5rem;
}
.gap-1-75--rem {
  gap: 1.75rem;
}
.gap-2--rem {
  gap: 2rem;
}
.gap-2-25--rem {
  gap: 2.25rem;
}
.gap-2-5--rem {
  gap: 2.5rem;
}
.gap-2-75--rem {
  gap: 2.75rem;
}
.gap-3--rem {
  gap: 3rem;
}
.gap-3-25--rem {
  gap: 3.25rem;
}
.gap-3-5--rem {
  gap: 3.5rem;
}
.gap-3-75--rem {
  gap: 3.75rem;
}
.gap-4--rem {
  gap: 4rem;
}
.gap-4-25--rem {
  gap: 4.25rem;
}
.gap-4-5--rem {
  gap: 4.5rem;
}
.gap-4-75--rem {
  gap: 4.75rem;
}
.gap-6--rem {
  gap: 6rem;
}
.gap-8--rem {
  gap: 8rem;
}
.gap-16--rem {
  gap: 16rem;
}
.gap-2--px {
  gap: 2px;
}
.gap-4--px {
  gap: 4px;
}
.gap-6--px {
  gap: 6px;
}
.gap-8--px {
  gap: 8px;
}
.gap-12--px {
  gap: 12px;
}
.gap-16--px {
  gap: 16px;
}
.gap-18--px {
  gap: 18px;
}
.gap-20--px {
  gap: 20px;
}
.gap-22--px {
  gap: 22px;
}
.gap-24--px {
  gap: 24px;
}
.gap-32--px {
  gap: 32px;
}
.gap-34--px {
  gap: 34px;
}
.gap-36--px {
  gap: 36px;
}
.gap-38--px {
  gap: 38px;
}
.gap-40--px {
  gap: 40px;
}
.gap-42--px {
  gap: 42px;
}
.gap-48--px {
  gap: 48px;
}
.gap-52--px {
  gap: 52px;
}
.gap-62--px {
  gap: 62px;
}
.gap-72--px {
  gap: 72px;
}
.gap-82--px {
  gap: 82px;
}

.basis-120--px {
  flex-basis: 120px;
}

.divider-hor {
  border-top: 1px solid var(--color-outline);
  min-width: 100%;
}
.divider-vert {
  border-left: 1px solid var(--color-outline);
  min-height: 100%;
}

.over-scroll-y--auto {
  overflow-y: auto;
}

.cursor-not-allowed {
  cursor: not-allowed;
}

.disabled {
  cursor: not-allowed;
}

.point-events--none {
  pointer-events: none;
}

.border-1px {
  border: 1px solid rgb(var(--color-on-surface-rgb)/0.12);
}
.border-radius-05 {
  border-radius: 0.5rem;
}
.border-radius-1 {
  border-radius: 1rem;
}
.border-radius-2 {
  border-radius: 2rem;
}

@media screen and (min-width: 640px) {
  .display-mobile--only {
    display: none;
  }
}

/*# sourceMappingURL=utilities.css.map */