html {
    color: rgba(0, 0, 0, .87)
  }

  ::-moz-selection {
    background: #b3d4fc;
    text-shadow: none
  }

  ::selection {
    background: #b3d4fc;
    text-shadow: none
  }

  img {
    vertical-align: middle
  }

  .visuallyhidden.focusable:active,
  .visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto
  }

  .clearfix:before,
  .clearfix:after {
    content: " ";
    display: table
  }

  .clearfix:after {
    clear: both
  }

  a {
    -webkit-tap-highlight-color: rgba(255, 255, 255, 0)
  }

  html {
    width: 100%;
    height: 100%;
    -ms-touch-action: manipulation;
    touch-action: manipulation
  }

  body {
    width: 100%;
    min-height: 100%;
    margin: 0
  }

  main {
    display: block
  }

  html,
  body {
    font-family: "Helvetica", "Arial", sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px
  }

  h1,
  h2,
  h3,
  p {
    padding: 0
  }

  h1 {
    letter-spacing: -.02em;
    margin: 24px 0
  }

  h1,
  h2 {
    font-family: "Roboto", "Helvetica", "Arial", sans-serif
  }

  h2 {
    line-height: 48px
  }

  h2,
  h3 {
    margin: 24px 0
  }

  h3 {
    line-height: 40px
  }

  h3 {
    font-family: "Roboto", "Helvetica", "Arial", sans-serif
  }

  p {
    font-weight: 400;
    line-height: 24px
  }

  p {
    font-size: 14px;
    letter-spacing: 0;
    margin: 0 0 16px
  }

  a {
    font-weight: 500
  }

  blockquote:before {
    position: absolute;
    left: -.5em;
    content: "“"
  }

  blockquote:after {
    content: "”";
    margin-left: -.05em
  }

  ul {
    font-weight: 400;
    letter-spacing: 0
  }

  ul {
    font-size: 14px;
    line-height: 24px
  }

  .mdl-badge[data-badge]:after {
    content: attr(data-badge);
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-align-content: center;
    -ms-flex-line-pack: center;
    align-content: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    position: absolute;
    top: -11px;
    right: -24px;
    font-family: "Roboto", "Helvetica", "Arial", sans-serif;
    font-weight: 600;
    font-size: 12px;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #ff4081;
    color: #fff
  }

  .mdl-button .mdl-badge[data-badge]:after {
    top: -10px;
    right: -5px
  }

  .mdl-badge.mdl-badge--no-background[data-badge]:after {
    color: #ff4081;
    background: rgba(255, 255, 255, .2);
    box-shadow: 0 0 1px gray
  }

  .mdl-badge.mdl-badge--overlap:after {
    right: -10px
  }

  .mdl-button::-moz-focus-inner {
    border: 0
  }

  .mdl-button:hover {
    background-color: rgba(158, 158, 158, .2)
  }

  .mdl-button:focus:not(:active) {
    background-color: rgba(0, 0, 0, .12)
  }

  .mdl-button:active {
    background-color: rgba(158, 158, 158, .4)
  }

  .mdl-button.mdl-button--colored:focus:not(:active) {
    background-color: rgba(0, 0, 0, .12)
  }

  .mdl-button--raised:active {
    box-shadow: 0 4px 5px 0 rgba(0, 0, 0, .14), 0 1px 10px 0 rgba(0, 0, 0, .12), 0 2px 4px -1px rgba(0, 0, 0, .2);
    background-color: rgba(158, 158, 158, .4)
  }

  .mdl-button--raised:focus:not(:active) {
    box-shadow: 0 0 8px rgba(0, 0, 0, .18), 0 8px 16px rgba(0, 0, 0, .36);
    background-color: rgba(158, 158, 158, .4)
  }

  .mdl-button--raised.mdl-button--colored:hover {
    background-color: #3f51b5
  }

  .mdl-button--raised.mdl-button--colored:active {
    background-color: #3f51b5
  }

  .mdl-button--raised.mdl-button--colored:focus:not(:active) {
    background-color: #3f51b5
  }

  .mdl-button--fab:active {
    box-shadow: 0 4px 5px 0 rgba(0, 0, 0, .14), 0 1px 10px 0 rgba(0, 0, 0, .12), 0 2px 4px -1px rgba(0, 0, 0, .2);
    background-color: rgba(158, 158, 158, .4)
  }

  .mdl-button--fab:focus:not(:active) {
    box-shadow: 0 0 8px rgba(0, 0, 0, .18), 0 8px 16px rgba(0, 0, 0, .36);
    background-color: rgba(158, 158, 158, .4)
  }

  .mdl-button--fab.mdl-button--colored:hover {
    background-color: #ff4081
  }

  .mdl-button--fab.mdl-button--colored:focus:not(:active) {
    background-color: #ff4081
  }

  .mdl-button--fab.mdl-button--colored:active {
    background-color: #ff4081
  }

  .mdl-data-table tbody tr:hover {
    background-color: #eee
  }

  .mdl-data-table th.mdl-data-table__header--sorted-ascending:before,
  .mdl-data-table th.mdl-data-table__header--sorted-descending:before {
    font-family: "Material Icons";
    font-weight: 400;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    word-wrap: normal;
    -moz-font-feature-settings: "liga";
    font-feature-settings: "liga";
    -webkit-font-feature-settings: "liga";
    -webkit-font-smoothing: antialiased;
    font-size: 16px;
    content: "";
    margin-right: 5px;
    vertical-align: sub
  }

  .mdl-data-table th.mdl-data-table__header--sorted-ascending:hover,
  .mdl-data-table th.mdl-data-table__header--sorted-descending:hover {
    cursor: pointer
  }

  .mdl-data-table th.mdl-data-table__header--sorted-ascending:hover:before,
  .mdl-data-table th.mdl-data-table__header--sorted-descending:hover:before {
    color: rgba(0, 0, 0, .26)
  }

  .mdl-data-table th.mdl-data-table__header--sorted-descending:before {
    content: ""
  }

  .mdl-mega-footer--top-section:after,
  .mdl-mega-footer--middle-section:after,
  .mdl-mega-footer--bottom-section:after,
  .mdl-mega-footer__top-section:after,
  .mdl-mega-footer__middle-section:after,
  .mdl-mega-footer__bottom-section:after {
    content: "";
    display: block;
    clear: both
  }

  @media screen and (min-width:760px) {

    .mdl-mega-footer--drop-down-section:nth-child(3):after,
    .mdl-mega-footer__drop-down-section:nth-child(3):after {
      clear: right
    }

    .mdl-mega-footer--middle-section:after,
    .mdl-mega-footer__middle-section:after {
      content: "";
      display: block;
      clear: both
    }
  }

  .mdl-mega-footer--heading-checkbox+.mdl-mega-footer--heading:after,
  .mdl-mega-footer--heading-checkbox+.mdl-mega-footer__heading:after,
  .mdl-mega-footer__heading-checkbox+.mdl-mega-footer--heading:after,
  .mdl-mega-footer__heading-checkbox+.mdl-mega-footer__heading:after {
    font-family: "Material Icons";
    content: ""
  }

  .mdl-mega-footer--heading-checkbox:checked+.mdl-mega-footer--heading:after,
  .mdl-mega-footer--heading-checkbox:checked+.mdl-mega-footer__heading:after,
  .mdl-mega-footer__heading-checkbox:checked+.mdl-mega-footer--heading:after,
  .mdl-mega-footer__heading-checkbox:checked+.mdl-mega-footer__heading:after {
    font-family: "Material Icons";
    content: ""
  }

  .mdl-mega-footer--heading:after,
  .mdl-mega-footer__heading:after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    display: block;
    width: 23.8px;
    height: 23.8px;
    background-size: cover
  }

  .mdl-mega-footer--link-list:after,
  .mdl-mega-footer__link-list:after {
    clear: both;
    display: block;
    content: ""
  }

  @media screen and (min-width:760px) {

    .mdl-mega-footer--heading-checkbox+.mdl-mega-footer--heading:after,
    .mdl-mega-footer--heading-checkbox+.mdl-mega-footer__heading:after,
    .mdl-mega-footer__heading-checkbox+.mdl-mega-footer--heading:after,
    .mdl-mega-footer__heading-checkbox+.mdl-mega-footer__heading:after {
      content: ""
    }

    .mdl-mega-footer--heading-checkbox:checked+.mdl-mega-footer--heading:after,
    .mdl-mega-footer--heading-checkbox:checked+.mdl-mega-footer__heading:after,
    .mdl-mega-footer__heading-checkbox:checked+.mdl-mega-footer--heading:after,
    .mdl-mega-footer__heading-checkbox:checked+.mdl-mega-footer__heading:after {
      content: ""
    }
  }

  .mdl-mini-footer:after {
    content: "";
    display: block
  }

  .mdl-menu__item::-moz-focus-inner {
    border: 0
  }

  .mdl-menu__item[disabled]:hover,
  .mdl-menu__item[data-mdl-disabled]:hover {
    background-color: transparent
  }

  .mdl-menu__item[disabled]:focus,
  .mdl-menu__item[data-mdl-disabled]:focus {
    background-color: transparent
  }

  .mdl-menu__item:hover {
    background-color: #eee
  }

  .mdl-menu__item:focus {
    outline: none;
    background-color: #eee
  }

  .mdl-menu__item:active {
    background-color: #e0e0e0
  }

  @-webkit-keyframes indeterminate1 {
    0% {
      left: 0%;
      width: 0%
    }

    50% {
      left: 25%;
      width: 75%
    }

    75% {
      left: 100%;
      width: 0%
    }
  }

  @keyframes indeterminate1 {
    0% {
      left: 0%;
      width: 0%
    }

    50% {
      left: 25%;
      width: 75%
    }

    75% {
      left: 100%;
      width: 0%
    }
  }

  @-webkit-keyframes indeterminate2 {

    0%,
    50% {
      left: 0%;
      width: 0%
    }

    75% {
      left: 0%;
      width: 25%
    }

    100% {
      left: 100%;
      width: 0%
    }
  }

  @keyframes indeterminate2 {

    0%,
    50% {
      left: 0%;
      width: 0%
    }

    75% {
      left: 0%;
      width: 25%
    }

    100% {
      left: 100%;
      width: 0%
    }
  }

  .mdl-layout__drawer .mdl-navigation .mdl-navigation__link:hover {
    background-color: #e0e0e0
  }

  .mdl-layout__tab-bar::-webkit-scrollbar {
    display: none
  }

  .mdl-layout.is-upgraded .mdl-layout__tab.is-active::after {
    height: 2px;
    width: 100%;
    display: block;
    content: " ";
    bottom: 0;
    left: 0;
    position: absolute;
    background: #ff4081;
    -webkit-animation: border-expand .2s cubic-bezier(.4, 0, .4, 1) .01s alternate forwards;
    animation: border-expand .2s cubic-bezier(.4, 0, .4, 1) .01s alternate forwards;
    transition: all 1s cubic-bezier(.4, 0, 1, 1)
  }

  .mdl-slider.is-upgraded::-moz-focus-outer {
    border: 0
  }

  .mdl-slider.is-upgraded::-ms-tooltip {
    display: none
  }

  .mdl-slider.is-upgraded::-webkit-slider-runnable-track {
    background: 0 0
  }

  .mdl-slider.is-upgraded::-moz-range-track {
    background: 0 0;
    border: none
  }

  .mdl-slider.is-upgraded::-ms-track {
    background: 0 0;
    color: transparent;
    height: 2px;
    width: 100%;
    border: none
  }

  .mdl-slider.is-upgraded::-ms-fill-lower {
    padding: 0;
    background: linear-gradient(to right, transparent, transparent 16px, #3f51b5 16px, #3f51b5 0)
  }

  .mdl-slider.is-upgraded::-ms-fill-upper {
    padding: 0;
    background: linear-gradient(to left, transparent, transparent 16px, rgba(0, 0, 0, .26) 16px, rgba(0, 0, 0, .26)0)
  }

  .mdl-slider.is-upgraded::-webkit-slider-thumb {
    -webkit-appearance: none;
    width: 12px;
    height: 12px;
    box-sizing: border-box;
    border-radius: 50%;
    background: #3f51b5;
    border: none;
    transition: transform .18s cubic-bezier(.4, 0, .2, 1), border .18s cubic-bezier(.4, 0, .2, 1), box-shadow .18s cubic-bezier(.4, 0, .2, 1), background .28s cubic-bezier(.4, 0, .2, 1);
    transition: transform .18s cubic-bezier(.4, 0, .2, 1), border .18s cubic-bezier(.4, 0, .2, 1), box-shadow .18s cubic-bezier(.4, 0, .2, 1), background .28s cubic-bezier(.4, 0, .2, 1), -webkit-transform .18s cubic-bezier(.4, 0, .2, 1)
  }

  .mdl-slider.is-upgraded::-moz-range-thumb {
    -moz-appearance: none;
    width: 12px;
    height: 12px;
    box-sizing: border-box;
    border-radius: 50%;
    background-image: none;
    background: #3f51b5;
    border: none
  }

  .mdl-slider.is-upgraded:focus:not(:active)::-webkit-slider-thumb {
    box-shadow: 0 0 0 10px rgba(63, 81, 181, .26)
  }

  .mdl-slider.is-upgraded:focus:not(:active)::-moz-range-thumb {
    box-shadow: 0 0 0 10px rgba(63, 81, 181, .26)
  }

  .mdl-slider.is-upgraded:active::-webkit-slider-thumb {
    background-image: none;
    background: #3f51b5;
    -webkit-transform: scale(1.5);
    transform: scale(1.5)
  }

  .mdl-slider.is-upgraded:active::-moz-range-thumb {
    background-image: none;
    background: #3f51b5;
    transform: scale(1.5)
  }

  .mdl-slider.is-upgraded::-ms-thumb {
    width: 32px;
    height: 32px;
    border: none;
    border-radius: 50%;
    background: #3f51b5;
    transform: scale(.375);
    transition: transform .18s cubic-bezier(.4, 0, .2, 1), background .28s cubic-bezier(.4, 0, .2, 1);
    transition: transform .18s cubic-bezier(.4, 0, .2, 1), background .28s cubic-bezier(.4, 0, .2, 1), -webkit-transform .18s cubic-bezier(.4, 0, .2, 1)
  }

  .mdl-slider.is-upgraded:focus:not(:active)::-ms-thumb {
    background: radial-gradient(circle closest-side, #3f51b5 0%, #3f51b5 37.5%, rgba(63, 81, 181, .26) 37.5%, rgba(63, 81, 181, .26) 100%);
    transform: scale(1)
  }

  .mdl-slider.is-upgraded:active::-ms-thumb {
    background: #3f51b5;
    transform: scale(.5625)
  }

  .mdl-slider.is-upgraded.is-lowest-value::-webkit-slider-thumb {
    border: 2px solid rgba(0, 0, 0, .26);
    background: 0 0
  }

  .mdl-slider.is-upgraded.is-lowest-value::-moz-range-thumb {
    border: 2px solid rgba(0, 0, 0, .26);
    background: 0 0
  }

  .mdl-slider.is-upgraded.is-lowest-value:focus:not(:active)::-webkit-slider-thumb {
    box-shadow: 0 0 0 10px rgba(0, 0, 0, .12);
    background: rgba(0, 0, 0, .12)
  }

  .mdl-slider.is-upgraded.is-lowest-value:focus:not(:active)::-moz-range-thumb {
    box-shadow: 0 0 0 10px rgba(0, 0, 0, .12);
    background: rgba(0, 0, 0, .12)
  }

  .mdl-slider.is-upgraded.is-lowest-value:active::-webkit-slider-thumb {
    border: 1.6px solid rgba(0, 0, 0, .26);
    -webkit-transform: scale(1.5);
    transform: scale(1.5)
  }

  .mdl-slider.is-upgraded.is-lowest-value:active+.mdl-slider__background-flex>.mdl-slider__background-upper {
    left: 9px
  }

  .mdl-slider.is-upgraded.is-lowest-value:active::-moz-range-thumb {
    border: 1.5px solid rgba(0, 0, 0, .26);
    transform: scale(1.5)
  }

  .mdl-slider.is-upgraded.is-lowest-value::-ms-thumb {
    background: radial-gradient(circle closest-side, transparent 0%, transparent 66.67%, rgba(0, 0, 0, .26) 66.67%, rgba(0, 0, 0, .26) 100%)
  }

  .mdl-slider.is-upgraded.is-lowest-value:focus:not(:active)::-ms-thumb {
    background: radial-gradient(circle closest-side, rgba(0, 0, 0, .12) 0%, rgba(0, 0, 0, .12) 25%, rgba(0, 0, 0, .26) 25%, rgba(0, 0, 0, .26) 37.5%, rgba(0, 0, 0, .12) 37.5%, rgba(0, 0, 0, .12) 100%);
    transform: scale(1)
  }

  .mdl-slider.is-upgraded.is-lowest-value:active::-ms-thumb {
    transform: scale(.5625);
    background: radial-gradient(circle closest-side, transparent 0%, transparent 77.78%, rgba(0, 0, 0, .26) 77.78%, rgba(0, 0, 0, .26) 100%)
  }

  .mdl-slider.is-upgraded.is-lowest-value::-ms-fill-lower {
    background: 0 0
  }

  .mdl-slider.is-upgraded.is-lowest-value::-ms-fill-upper {
    margin-left: 6px
  }

  .mdl-slider.is-upgraded.is-lowest-value:active::-ms-fill-upper {
    margin-left: 9px
  }

  .mdl-slider.is-upgraded:disabled:focus::-webkit-slider-thumb,
  .mdl-slider.is-upgraded:disabled:active::-webkit-slider-thumb,
  .mdl-slider.is-upgraded:disabled::-webkit-slider-thumb {
    -webkit-transform: scale(.667);
    transform: scale(.667);
    background: rgba(0, 0, 0, .26)
  }

  .mdl-slider.is-upgraded:disabled:focus::-moz-range-thumb,
  .mdl-slider.is-upgraded:disabled:active::-moz-range-thumb,
  .mdl-slider.is-upgraded:disabled::-moz-range-thumb {
    transform: scale(.667);
    background: rgba(0, 0, 0, .26)
  }

  .mdl-slider.is-upgraded.is-lowest-value:disabled:focus::-webkit-slider-thumb,
  .mdl-slider.is-upgraded.is-lowest-value:disabled:active::-webkit-slider-thumb,
  .mdl-slider.is-upgraded.is-lowest-value:disabled::-webkit-slider-thumb {
    border: 3px solid rgba(0, 0, 0, .26);
    background: 0 0;
    -webkit-transform: scale(.667);
    transform: scale(.667)
  }

  .mdl-slider.is-upgraded.is-lowest-value:disabled:focus::-moz-range-thumb,
  .mdl-slider.is-upgraded.is-lowest-value:disabled:active::-moz-range-thumb,
  .mdl-slider.is-upgraded.is-lowest-value:disabled::-moz-range-thumb {
    border: 3px solid rgba(0, 0, 0, .26);
    background: 0 0;
    transform: scale(.667)
  }

  .mdl-slider.is-upgraded.is-lowest-value:disabled:active+.mdl-slider__background-flex>.mdl-slider__background-upper {
    left: 6px
  }

  .mdl-slider.is-upgraded:disabled:focus::-ms-thumb,
  .mdl-slider.is-upgraded:disabled:active::-ms-thumb,
  .mdl-slider.is-upgraded:disabled::-ms-thumb {
    transform: scale(.25);
    background: rgba(0, 0, 0, .26)
  }

  .mdl-slider.is-upgraded.is-lowest-value:disabled:focus::-ms-thumb,
  .mdl-slider.is-upgraded.is-lowest-value:disabled:active::-ms-thumb,
  .mdl-slider.is-upgraded.is-lowest-value:disabled::-ms-thumb {
    transform: scale(.25);
    background: radial-gradient(circle closest-side, transparent 0%, transparent 50%, rgba(0, 0, 0, .26) 50%, rgba(0, 0, 0, .26) 100%)
  }

  .mdl-slider.is-upgraded:disabled::-ms-fill-lower {
    margin-right: 6px;
    background: linear-gradient(to right, transparent, transparent 25px, rgba(0, 0, 0, .26) 25px, rgba(0, 0, 0, .26)0)
  }

  .mdl-slider.is-upgraded:disabled::-ms-fill-upper {
    margin-left: 6px
  }

  .mdl-slider.is-upgraded.is-lowest-value:disabled:active::-ms-fill-upper {
    margin-left: 6px
  }

  .mdl-snackbar__action::-moz-focus-inner {
    border: 0
  }

  .mdl-spinner:not(.is-upgraded).is-active:after {
    content: "Loading..."
  }

  @-webkit-keyframes mdl-spinner__container-rotate {
    to {
      -webkit-transform: rotate(360deg);
      transform: rotate(360deg)
    }
  }

  @keyframes mdl-spinner__container-rotate {
    to {
      -webkit-transform: rotate(360deg);
      transform: rotate(360deg)
    }
  }

  @-webkit-keyframes mdl-spinner__fill-unfill-rotate {
    12.5% {
      -webkit-transform: rotate(135deg);
      transform: rotate(135deg)
    }

    25% {
      -webkit-transform: rotate(270deg);
      transform: rotate(270deg)
    }

    37.5% {
      -webkit-transform: rotate(405deg);
      transform: rotate(405deg)
    }

    50% {
      -webkit-transform: rotate(540deg);
      transform: rotate(540deg)
    }

    62.5% {
      -webkit-transform: rotate(675deg);
      transform: rotate(675deg)
    }

    75% {
      -webkit-transform: rotate(810deg);
      transform: rotate(810deg)
    }

    87.5% {
      -webkit-transform: rotate(945deg);
      transform: rotate(945deg)
    }

    to {
      -webkit-transform: rotate(1080deg);
      transform: rotate(1080deg)
    }
  }

  @keyframes mdl-spinner__fill-unfill-rotate {
    12.5% {
      -webkit-transform: rotate(135deg);
      transform: rotate(135deg)
    }

    25% {
      -webkit-transform: rotate(270deg);
      transform: rotate(270deg)
    }

    37.5% {
      -webkit-transform: rotate(405deg);
      transform: rotate(405deg)
    }

    50% {
      -webkit-transform: rotate(540deg);
      transform: rotate(540deg)
    }

    62.5% {
      -webkit-transform: rotate(675deg);
      transform: rotate(675deg)
    }

    75% {
      -webkit-transform: rotate(810deg);
      transform: rotate(810deg)
    }

    87.5% {
      -webkit-transform: rotate(945deg);
      transform: rotate(945deg)
    }

    to {
      -webkit-transform: rotate(1080deg);
      transform: rotate(1080deg)
    }
  }

  @-webkit-keyframes mdl-spinner__layer-1-fade-in-out {

    from,
    25% {
      opacity: .99
    }

    26%,
    89% {
      opacity: 0
    }

    90%,
    100% {
      opacity: .99
    }
  }

  @keyframes mdl-spinner__layer-1-fade-in-out {

    from,
    25% {
      opacity: .99
    }

    26%,
    89% {
      opacity: 0
    }

    90%,
    100% {
      opacity: .99
    }
  }

  @-webkit-keyframes mdl-spinner__layer-2-fade-in-out {

    from,
    15% {
      opacity: 0
    }

    25%,
    50% {
      opacity: .99
    }

    51% {
      opacity: 0
    }
  }

  @keyframes mdl-spinner__layer-2-fade-in-out {

    from,
    15% {
      opacity: 0
    }

    25%,
    50% {
      opacity: .99
    }

    51% {
      opacity: 0
    }
  }

  @-webkit-keyframes mdl-spinner__layer-3-fade-in-out {

    from,
    40% {
      opacity: 0
    }

    50%,
    75% {
      opacity: .99
    }

    76% {
      opacity: 0
    }
  }

  @keyframes mdl-spinner__layer-3-fade-in-out {

    from,
    40% {
      opacity: 0
    }

    50%,
    75% {
      opacity: .99
    }

    76% {
      opacity: 0
    }
  }

  @-webkit-keyframes mdl-spinner__layer-4-fade-in-out {

    from,
    65% {
      opacity: 0
    }

    75%,
    90% {
      opacity: .99
    }

    100% {
      opacity: 0
    }
  }

  @keyframes mdl-spinner__layer-4-fade-in-out {

    from,
    65% {
      opacity: 0
    }

    75%,
    90% {
      opacity: .99
    }

    100% {
      opacity: 0
    }
  }

  @-webkit-keyframes mdl-spinner__left-spin {
    from {
      -webkit-transform: rotate(130deg);
      transform: rotate(130deg)
    }

    50% {
      -webkit-transform: rotate(-5deg);
      transform: rotate(-5deg)
    }

    to {
      -webkit-transform: rotate(130deg);
      transform: rotate(130deg)
    }
  }

  @keyframes mdl-spinner__left-spin {
    from {
      -webkit-transform: rotate(130deg);
      transform: rotate(130deg)
    }

    50% {
      -webkit-transform: rotate(-5deg);
      transform: rotate(-5deg)
    }

    to {
      -webkit-transform: rotate(130deg);
      transform: rotate(130deg)
    }
  }

  @-webkit-keyframes mdl-spinner__right-spin {
    from {
      -webkit-transform: rotate(-130deg);
      transform: rotate(-130deg)
    }

    50% {
      -webkit-transform: rotate(5deg);
      transform: rotate(5deg)
    }

    to {
      -webkit-transform: rotate(-130deg);
      transform: rotate(-130deg)
    }
  }

  @keyframes mdl-spinner__right-spin {
    from {
      -webkit-transform: rotate(-130deg);
      transform: rotate(-130deg)
    }

    50% {
      -webkit-transform: rotate(5deg);
      transform: rotate(5deg)
    }

    to {
      -webkit-transform: rotate(-130deg);
      transform: rotate(-130deg)
    }
  }

  .mdl-tabs.is-upgraded .mdl-tabs__tab.is-active:after {
    height: 2px;
    width: 100%;
    display: block;
    content: " ";
    bottom: 0;
    left: 0;
    position: absolute;
    background: #3f51b5;
    -webkit-animation: border-expand .2s cubic-bezier(.4, 0, .4, 1) .01s alternate forwards;
    animation: border-expand .2s cubic-bezier(.4, 0, .4, 1) .01s alternate forwards;
    transition: all 1s cubic-bezier(.4, 0, 1, 1)
  }

  @-webkit-keyframes border-expand {
    0% {
      opacity: 0;
      width: 0
    }

    100% {
      opacity: 1;
      width: 100%
    }
  }

  @keyframes border-expand {
    0% {
      opacity: 0;
      width: 0
    }

    100% {
      opacity: 1;
      width: 100%
    }
  }

  .mdl-textfield__input[type="number"]::-webkit-inner-spin-button,
  .mdl-textfield__input[type="number"]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0
  }

  .mdl-textfield__label:after {
    background-color: #3f51b5;
    bottom: 20px;
    content: "";
    height: 2px;
    left: 45%;
    position: absolute;
    transition-duration: .2s;
    transition-timing-function: cubic-bezier(.4, 0, .2, 1);
    visibility: hidden;
    width: 10px
  }

  .mdl-textfield.is-focused .mdl-textfield__label:after {
    left: 0;
    visibility: visible;
    width: 100%
  }

  .mdl-textfield.is-invalid .mdl-textfield__label:after {
    background-color: #d50000
  }

  .mdl-textfield__expandable-holder .mdl-textfield__label:after {
    bottom: 0
  }

  @-webkit-keyframes pulse {
    0% {
      -webkit-transform: scale(0);
      transform: scale(0);
      opacity: 0
    }

    50% {
      -webkit-transform: scale(.99);
      transform: scale(.99)
    }

    100% {
      -webkit-transform: scale(1);
      transform: scale(1);
      opacity: 1;
      visibility: visible
    }
  }

  @keyframes pulse {
    0% {
      -webkit-transform: scale(0);
      transform: scale(0);
      opacity: 0
    }

    50% {
      -webkit-transform: scale(.99);
      transform: scale(.99)
    }

    100% {
      -webkit-transform: scale(1);
      transform: scale(1);
      opacity: 1;
      visibility: visible
    }
  }


  * {
    margin: 0;
    box-sizing: border-box;
    padding: 0
  }

  html {
    scroll-behavior: smooth
  }

  body {
    font-family: "Manrope", sans-serif;
    background: #FAFAFA;
    color: #2C2C2C;
    line-height: 1.7;
    font-size: 17px
  }

  img {
    display: block;
    max-width: 100%
  }

  .top_tier_8kx {
    background: linear-gradient(135deg, #006A9E 0%, rgba(0, 106, 158, 0.85) 100%);
    padding: 18px 0;
    text-align: center
  }

  .company_headline_97m {
    font-size: 26px;
    font-weight: 700;
    color: #FAFAFA;
    letter-spacing: 0.5px
  }

  .middle_segment_4hv {
    background: #2C2C2C;
    padding: 22px 40px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
    flex-wrap: wrap
  }

  .logo_holder_2qw {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto
  }

  .logo_holder_2qw img {
    height: 85px;
    width: 85px;
    object-fit: contain
  }

  .contact_info_3zp {
    display: flex;
    align-items: center;
    gap: 15px;
    color: #FAFAFA;
    font-size: 15px
  }

  .email_link_9df {
    color: #FAFAFA;
    transition: color 0.25s ease
  }

  .email_link_9df:hover {
    color: #006A9E
  }

  .nav_row_5jt {
    background: #FAFAFA;
    padding: 0;
    box-shadow: 0 2px 8px rgba(44, 44, 44, 0.1)
  }

  .navigation_container_6kr {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 20px
  }

  .main_navigation_8pl {
    display: flex;
    list-style: none;
    gap: 0;
    margin: 0;
    padding: 0
  }

  .main_navigation_8pl li {
    margin: 0
  }

  .main_navigation_8pl a {
    display: block;
    padding: 20px 28px;
    color: #2C2C2C;
    font-weight: 600;
    font-size: 16px;
    transition: background-color 0.25s ease, color 0.25s ease;
    position: relative
  }

  .main_navigation_8pl a:hover {
    background-color: rgba(0, 106, 158, 0.08);
    color: #006A9E
  }

  .main_navigation_8pl a:focus {
    outline: 3px solid #006A9E;
    outline-offset: -3px
  }

  main {
    min-height: 400px
  }

  .footer_massive_7xh {
    background: linear-gradient(180deg, #2C2C2C 0%, #1a1a1a 100%);
    padding: 80px 40px 0;
    color: #FAFAFA;
    position: relative
  }

  .footer_hero_content_9mk {
    max-width: 1100px;
    margin: 0 auto;
    text-align: center;
    padding-bottom: 70px
  }

  .footer_headline_4pr {
    font-size: 38px;
    font-weight: 700;
    margin-bottom: 25px;
    color: #FAFAFA
  }

  .footer_description_8vn {
    font-size: 18px;
    line-height: 1.8;
    color: rgba(250, 250, 250, 0.85);
    margin-bottom: 35px;
    max-width: 750px;
    margin-left: auto;
    margin-right: auto
  }

  .footer_links_radial_2ht {
    display: flex;
    justify-content: center;
    gap: 40px;
    flex-wrap: wrap;
    margin-bottom: 30px
  }

  .footer_links_radial_2ht a {
    color: #FAFAFA;
    font-size: 16px;
    font-weight: 500;
    transition: color 0.25s ease
  }

  .footer_links_radial_2ht a:hover {
    color: #006A9E
  }

  .footer_utility_strip_3kq {
    background: rgba(0, 0, 0, 0.3);
    padding: 20px 40px;
    text-align: center;
    font-size: 14px;
    color: rgba(250, 250, 250, 0.7)
  }

  .copyright_text_5wm {
    margin: 0
  }

  .consent_frame_7bk {
    position: fixed;
    bottom: 30px;
    right: 30px;
    width: 420px;
    background: #ffffff;
    border-radius: 6px;
    box-shadow: 0 8px 24px rgba(44, 44, 44, 0.25);
    padding: 28px;
    z-index: 9999;
    border-left: 4px solid #006A9E
  }

  .toggle_switch_5pn::after {
    content: "";
    position: absolute;
    top: 3px;
    left: 3px;
    width: 18px;
    height: 18px;
    background: #ffffff;
    border-radius: 50%;
    transition: transform 0.25s ease
  }

  .toggle_switch_5pn.active_state_8rt::after {
    transform: translateX(24px)
  }

  .consent_btn_4xr:hover {
    opacity: 0.85
  }

  .consent_btn_4xr:focus {
    outline: 3px solid #006A9E;
    outline-offset: 2px
  }

  @media (max-width:768px) {
    .top_tier_8kx {
      padding: 14px 20px
    }

    .company_headline_97m {
      font-size: 20px
    }

    .middle_segment_4hv {
      flex-direction: column;
      padding: 18px 20px;
      gap: 15px
    }

    .logo_holder_2qw img {
      height: 70px;
      width: 70px
    }

    .contact_info_3zp {
      display: none
    }

    .navigation_container_6kr {
      padding: 0
    }

    .main_navigation_8pl {
      flex-direction: column;
      width: 100%
    }

    .main_navigation_8pl a {
      padding: 16px 20px;
      border-bottom: 1px solid #e0e0e0
    }

    .footer_massive_7xh {
      padding: 50px 20px 0
    }

    .footer_headline_4pr {
      font-size: 28px
    }

    .footer_description_8vn {
      font-size: 16px
    }

    .footer_links_radial_2ht {
      flex-direction: column;
      gap: 15px
    }

    .consent_frame_7bk {
      bottom: 0;
      right: 0;
      left: 0;
      width: 100%;
      border-radius: 0;
      border-left: none;
      border-top: 4px solid #006A9E
    }
  }

  .kontakt-seite-wrapper {
    background: linear-gradient(135deg, #FAFAFA 0%, #ffffff 50%, #f5f8fa 100%);
    min-height: 600px
  }

  .kontakt-intro-bereich {
    max-width: 920px;
    margin: 0 auto;
    padding: 85px 25px 70px;
    text-align: center
  }

  .kontakt-intro-bereich h1 {
    font-size: 2.8rem;
    color: #2C2C2C;
    font-weight: 700;
    margin-bottom: 28px;
    line-height: 1.2
  }

  .kontakt-intro-bereich .einleitung-text {
    font-size: 1.15rem;
    color: #495057;
    line-height: 1.75;
    max-width: 680px;
    margin: 0 auto 20px
  }

  .formular-info-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 25px 90px;
    display: grid;
    grid-template-columns: 1fr 1.4fr;
    gap: 60px;
    align-items: start
  }

  .info-panel-links {
    background: #ffffff;
    border-radius: 12px;
    padding: 45px 35px;
    box-shadow: 0 4px 16px rgba(0, 106, 158, 0.08);
    position: sticky;
    top: 30px
  }

  .info-panel-links h2 {
    font-size: 1.6rem;
    color: #2C2C2C;
    margin-bottom: 30px;
    font-weight: 600;
    padding-bottom: 18px;
    border-bottom: 3px solid #006A9E
  }

  .kontakt-detail-block {
    margin-bottom: 32px
  }

  .kontakt-detail-block h3 {
    font-size: 0.95rem;
    color: #006A9E;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    margin-bottom: 10px;
    font-weight: 600
  }

  .kontakt-detail-block p {
    font-size: 1.05rem;
    color: #495057;
    line-height: 1.7;
    margin: 0
  }

  .kontakt-detail-block a {
    color: #2C2C2C;
    text-decoration: none;
    transition: color 0.3s ease
  }

  .kontakt-detail-block a:hover {
    color: #006A9E
  }

  .bild-kontakt-wrapper {
    margin-top: 35px;
    border-radius: 8px;
    overflow: hidden
  }

  .bild-kontakt-wrapper img {
    width: 100%;
    height: 240px;
    object-fit: cover;
    display: block
  }

  .formular-hauptbereich {
    background: #ffffff;
    border-radius: 12px;
    padding: 50px 45px;
    box-shadow: 0 6px 24px rgba(44, 44, 44, 0.06)
  }

  .formular-hauptbereich h2 {
    font-size: 1.85rem;
    color: #2C2C2C;
    margin-bottom: 15px;
    font-weight: 600
  }

  .formular-beschreibung {
    font-size: 1.05rem;
    color: #495057;
    line-height: 1.7;
    margin-bottom: 40px
  }

  .formular-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 28px;
    margin-bottom: 28px
  }

  .feld-wrapper-voll {
    grid-column: 1/-1
  }

  .eingabe-label {
    display: block;
    font-size: 0.95rem;
    color: #2C2C2C;
    margin-bottom: 8px;
    font-weight: 500
  }

  .eingabe-feld {
    width: 100%;
    padding: 14px 18px;
    font-size: 1rem;
    border: 2px solid #e1e4e8;
    border-radius: 6px;
    transition: all 0.3s ease;
    font-family: inherit;
    color: #2C2C2C;
    background: #FAFAFA
  }

  .eingabe-feld:focus {
    outline: none;
    border-color: #006A9E;
    background: #ffffff;
    box-shadow: 0 0 0 3px rgba(0, 106, 158, 0.1)
  }

  .eingabe-feld::placeholder {
    color: #9ca3af
  }

  .textarea-feld {
    min-height: 160px;
    resize: vertical;
    font-family: inherit
  }

  .kategorie-auswahl {
    width: 100%;
    padding: 14px 18px;
    font-size: 1rem;
    border: 2px solid #e1e4e8;
    border-radius: 6px;
    transition: all 0.3s ease;
    font-family: inherit;
    color: #2C2C2C;
    background: #FAFAFA;
    cursor: pointer
  }

  .kategorie-auswahl:focus {
    outline: none;
    border-color: #006A9E;
    background: #ffffff;
    box-shadow: 0 0 0 3px rgba(0, 106, 158, 0.1)
  }

  .zustimmung-bereich {
    margin: 35px 0 30px;
    display: flex;
    align-items: start;
    gap: 12px
  }

  .zustimmung-checkbox {
    margin-top: 4px;
    width: 20px;
    height: 20px;
    cursor: pointer;
    accent-color: #006A9E
  }

  .zustimmung-text {
    font-size: 0.95rem;
    color: #495057;
    line-height: 1.6
  }

  .zustimmung-text a {
    color: #006A9E;
    text-decoration: none;
    font-weight: 500;
    transition: color 0.3s ease
  }

  .zustimmung-text a:hover {
    color: #2C2C2C
  }

  .absenden-button {
    background: linear-gradient(135deg, #006A9E 0%, #004d73 100%);
    color: #ffffff;
    font-size: 1.1rem;
    font-weight: 600;
    padding: 16px 50px;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 4px 12px rgba(0, 106, 158, 0.25)
  }

  .absenden-button:hover {
    background: linear-gradient(135deg, #004d73 0%, #003552 100%);
    box-shadow: 0 6px 20px rgba(0, 106, 158, 0.35);
    transform: translateY(-2px)
  }

  .zusatz-info-bereich {
    background: linear-gradient(to right, #2C2C2C 0%, #1a1a1a 100%);
    padding: 80px 25px;
    margin-top: 60px
  }

  .zusatz-content-wrapper {
    max-width: 1100px;
    margin: 0 auto;
    text-align: center
  }

  .zusatz-content-wrapper h2 {
    font-size: 2.1rem;
    color: #ffffff;
    margin-bottom: 25px;
    font-weight: 600
  }

  .zeitinfo-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 35px;
    margin-top: 50px
  }

  .zeit-karte {
    background: rgba(250, 250, 250, 0.05);
    border: 1px solid rgba(250, 250, 250, 0.1);
    border-radius: 10px;
    padding: 35px 28px;
    transition: all 0.3s ease
  }

  .zeit-karte:hover {
    background: rgba(250, 250, 250, 0.08);
    border-color: rgba(0, 106, 158, 0.4);
    transform: translateY(-4px)
  }

  .zeit-karte h3 {
    font-size: 1.3rem;
    color: #006A9E;
    margin-bottom: 15px;
    font-weight: 600
  }

  .zeit-karte p {
    font-size: 1.05rem;
    color: #e1e4e8;
    line-height: 1.7;
    margin: 0
  }

  @media (max-width:968px) {
    .formular-info-container {
      grid-template-columns: 1fr;
      gap: 40px
    }

    .info-panel-links {
      position: static
    }

    .formular-grid {
      grid-template-columns: 1fr
    }
  }

  @media (max-width:768px) {
    .kontakt-intro-bereich {
      padding: 60px 20px 50px
    }

    .kontakt-intro-bereich h1 {
      font-size: 2.2rem
    }

    .formular-hauptbereich {
      padding: 35px 25px
    }

    .zusatz-info-bereich {
      padding: 60px 20px
    }

    .zusatz-content-wrapper h2 {
      font-size: 1.75rem
    }

    .zeitinfo-grid {
      grid-template-columns: 1fr
    }
  }

  @media (max-width:480px) {
    .kontakt-intro-bereich h1 {
      font-size: 1.85rem
    }

    .kontakt-intro-bereich .einleitung-text {
      font-size: 1.05rem
    }

    .formular-hauptbereich h2 {
      font-size: 1.5rem
    }

    .absenden-button {
      width: 100%;
      padding: 15px 30px
    }
  }

a {
  color: #0b57d0;
  text-decoration: none
}

a:hover {
text-decoration: underline
}
@property --tw-scale-x {
syntax: "*";
inherits: false;
initial-value: 1
}

@property --tw-scale-y {
syntax: "*";
inherits: false;
initial-value: 1
}

@property --tw-scale-z {
syntax: "*";
inherits: false;
initial-value: 1
}

@property --tw-rotate-x {
syntax: "*";
inherits: false
}

@property --tw-rotate-y {
syntax: "*";
inherits: false
}

@property --tw-rotate-z {
syntax: "*";
inherits: false
}

@property --tw-skew-x {
syntax: "*";
inherits: false
}

@property --tw-skew-y {
syntax: "*";
inherits: false
}

@property --tw-space-y-reverse {
syntax: "*";
inherits: false;
initial-value: 0
}

@property --tw-border-style {
syntax: "*";
inherits: false;
initial-value: solid
}

@property --tw-leading {
syntax: "*";
inherits: false
}

@property --tw-font-weight {
syntax: "*";
inherits: false
}

@property --tw-shadow {
syntax: "*";
inherits: false;
initial-value: 0 0#0000
}

@property --tw-shadow-color {
syntax: "*";
inherits: false
}

@property --tw-shadow-alpha {
syntax: "<percentage>";
inherits: false;
initial-value: 100%
}

@property --tw-inset-shadow {
syntax: "*";
inherits: false;
initial-value: 0 0#0000
}

@property --tw-inset-shadow-color {
syntax: "*";
inherits: false
}

@property --tw-inset-shadow-alpha {
syntax: "<percentage>";
inherits: false;
initial-value: 100%
}

@property --tw-ring-color {
syntax: "*";
inherits: false
}

@property --tw-ring-shadow {
syntax: "*";
inherits: false;
initial-value: 0 0#0000
}

@property --tw-inset-ring-color {
syntax: "*";
inherits: false
}

@property --tw-inset-ring-shadow {
syntax: "*";
inherits: false;
initial-value: 0 0#0000
}

@property --tw-ring-inset {
syntax: "*";
inherits: false
}

@property --tw-ring-offset-width {
syntax: "<length>";
inherits: false;
initial-value: 0
}

@property --tw-ring-offset-color {
syntax: "*";
inherits: false;
initial-value: #fff
}

@property --tw-ring-offset-shadow {
syntax: "*";
inherits: false;
initial-value: 0 0#0000
}

@property --tw-outline-style {
syntax: "*";
inherits: false;
initial-value: solid
}

@property --tw-duration {
syntax: "*";
inherits: false
}

@property --tw-ease {
syntax: "*";
inherits: false
}

@property --tw-translate-x {
syntax: "*";
inherits: false;
initial-value: 0
}

@property --tw-translate-y {
syntax: "*";
inherits: false;
initial-value: 0
}

@property --tw-translate-z {
syntax: "*";
inherits: false;
initial-value: 0
}

@property --tw-content {
syntax: "*";
inherits: false;
initial-value: ""
}

.sf-hidden {
display: none !important
}


 

@layer properties {
@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))) {

*,
:before,
:after,
::backdrop {
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-scale-z: 1;
  --tw-rotate-x: initial;
  --tw-rotate-y: initial;
  --tw-rotate-z: initial;
  --tw-skew-x: initial;
  --tw-skew-y: initial;
  --tw-space-y-reverse: 0;
  --tw-border-style: solid;
  --tw-leading: initial;
  --tw-font-weight: initial;
  --tw-shadow: 0 0#0000;
  --tw-shadow-color: initial;
  --tw-shadow-alpha: 100%;
  --tw-inset-shadow: 0 0#0000;
  --tw-inset-shadow-color: initial;
  --tw-inset-shadow-alpha: 100%;
  --tw-ring-color: initial;
  --tw-ring-shadow: 0 0#0000;
  --tw-inset-ring-color: initial;
  --tw-inset-ring-shadow: 0 0#0000;
  --tw-ring-inset: initial;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-offset-shadow: 0 0#0000;
  --tw-outline-style: solid;
  --tw-duration: initial;
  --tw-ease: initial;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-translate-z: 0;
  --tw-content: ""
}
}
}

@layer theme {

:root,
:host {
--font-sans: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
--font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
--color-red-300: oklch(80.8%.114 19.571);
--color-red-400: oklch(70.4%.191 22.216);
--color-red-500: oklch(63.7%.237 25.331);
--color-red-600: oklch(57.7%.245 27.325);
--color-red-700: oklch(50.5%.213 27.518);
--color-red-950: oklch(25.8%.092 26.042);
--color-amber-200: oklch(92.4%.12 95.746);
--color-amber-400: oklch(82.8%.189 84.429);
--color-amber-600: oklch(66.6%.179 58.318);
--color-amber-800: oklch(47.3%.137 46.201);
--color-amber-900: oklch(41.4%.112 45.904);
--color-green-200: oklch(92.5%.084 155.995);
--color-green-300: oklch(87.1%.15 154.449);
--color-green-500: oklch(72.3%.219 149.579);
--color-green-700: oklch(52.7%.154 150.069);
--color-green-800: oklch(44.8%.119 151.328);
--color-green-900: oklch(39.3%.095 152.535);
--color-blue-200: oklch(88.2%.059 254.128);
--color-blue-400: oklch(70.7%.165 254.624);
--color-blue-600: oklch(54.6%.245 262.881);
--color-blue-800: oklch(42.4%.199 265.638);
--color-blue-900: oklch(37.9%.146 265.522);
--color-purple-200: oklch(90.2%.063 306.703);
--color-purple-800: oklch(43.8%.218 303.724);
--color-purple-900: oklch(38.1%.176 304.987);
--color-pink-200: oklch(89.9%.061 343.231);
--color-pink-800: oklch(45.9%.187 3.815);
--color-pink-900: oklch(40.8%.153 2.432);
--color-slate-100: oklch(96.8%.007 247.896);
--color-slate-200: oklch(92.9%.013 255.508);
--color-slate-300: oklch(86.9%.022 252.894);
--color-slate-400: oklch(70.4%.04 256.788);
--color-slate-500: oklch(55.4%.046 257.417);
--color-slate-600: oklch(44.6%.043 257.281);
--color-slate-700: oklch(37.2%.044 257.287);
--color-slate-800: oklch(27.9%.041 260.031);
--color-slate-900: oklch(20.8%.042 265.755);
--color-slate-950: oklch(12.9%.042 264.695);
--color-gray-100: oklch(96.7%.003 264.542);
--color-gray-200: oklch(92.8%.006 264.531);
--color-gray-300: oklch(87.2%.01 258.338);
--color-gray-400: oklch(70.7%.022 261.325);
--color-gray-500: oklch(55.1%.027 264.364);
--color-gray-600: oklch(44.6%.03 256.802);
--color-gray-700: oklch(37.3%.034 259.733);
--color-gray-800: oklch(27.8%.033 256.848);
--color-gray-900: oklch(21%.034 264.665);
--color-gray-950: oklch(13%.028 261.692);
--color-zinc-100: oklch(96.7%.001 286.375);
--color-zinc-200: oklch(92%.004 286.32);
--color-zinc-300: oklch(87.1%.006 286.286);
--color-zinc-400: oklch(70.5%.015 286.067);
--color-zinc-500: oklch(55.2%.016 285.938);
--color-zinc-600: oklch(44.2%.017 285.786);
--color-zinc-700: oklch(37%.013 285.805);
--color-zinc-800: oklch(27.4%.006 286.033);
--color-zinc-900: oklch(21%.006 285.885);
--color-zinc-950: oklch(14.1%.005 285.823);
--color-neutral-100: oklch(97%0 0);
--color-neutral-200: oklch(92.2%0 0);
--color-neutral-300: oklch(87%0 0);
--color-neutral-400: oklch(70.8%0 0);
--color-neutral-500: oklch(55.6%0 0);
--color-neutral-600: oklch(43.9%0 0);
--color-neutral-700: oklch(37.1%0 0);
--color-neutral-800: oklch(26.9%0 0);
--color-neutral-900: oklch(20.5%0 0);
--color-neutral-950: oklch(14.5%0 0);
--color-stone-100: oklch(97%.001 106.424);
--color-stone-200: oklch(92.3%.003 48.717);
--color-stone-300: oklch(86.9%.005 56.366);
--color-stone-400: oklch(70.9%.01 56.259);
--color-stone-500: oklch(55.3%.013 58.071);
--color-stone-600: oklch(44.4%.011 73.639);
--color-stone-700: oklch(37.4%.01 67.558);
--color-stone-800: oklch(26.8%.007 34.298);
--color-stone-900: oklch(21.6%.006 56.043);
--color-stone-950: oklch(14.7%.004 49.25);
--color-white: #fff;
--spacing: calc(.25*var(--hem));
--container-xl: calc(36*var(--hem));
--container-7xl: calc(80*var(--hem));
--text-xs: calc(.75*var(--hem));
--text-xs--line-height: calc(1/.75);
--text-sm: calc(.875*var(--hem));
--text-sm--line-height: calc(1.25/.875);
--text-base: calc(1*var(--hem));
--text-base--line-height: 1.5;
--text-lg: calc(1.125*var(--hem));
--text-lg--line-height: calc(1.75/1.125);
--text-xl: calc(1.25*var(--hem));
--text-xl--line-height: calc(1.75/1.25);
--text-2xl: calc(1.5*var(--hem));
--text-2xl--line-height: calc(2/1.5);
--font-weight-medium: 500;
--font-weight-bold: 700;
--radius-xs: calc(.125*var(--hem));
--radius-md: calc(.375*var(--hem));
--radius-lg: calc(.5*var(--hem));
--radius-xl: calc(.75*var(--hem));
--radius-2xl: calc(1*var(--hem));
--radius-3xl: calc(1.5*var(--hem));
--animate-spin: spin 1s linear infinite;
--default-transition-duration: .15s;
--default-transition-timing-function: cubic-bezier(.4, 0, .2, 1);
--default-font-family: var(--font-sans);
--default-mono-font-family: var(--font-mono);
--hem: 1rem;
--animate-circle-grow: circle-grow .3s cubic-bezier(.05, .7, .1, 1)
}
}

@layer base {

*,
:after,
:before,
::backdrop {
box-sizing: border-box;
border: 0 solid;
margin: 0;
padding: 0
}

::file-selector-button {
box-sizing: border-box;
border: 0 solid;
margin: 0;
padding: 0
}

html,
:host {
-webkit-text-size-adjust: 100%;
tab-size: 4;
line-height: 1.5;
font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
font-feature-settings: var(--default-font-feature-settings, normal);
font-variation-settings: var(--default-font-variation-settings, normal);
-webkit-tap-highlight-color: transparent
}

hr {
height: 0;
color: inherit;
border-top-width: 1px
}

abbr:where([title]) {
-webkit-text-decoration: underline dotted;
text-decoration: underline dotted
}

h1,
h2,
h3,
h4,
h5,
h6 {
font-size: inherit;
font-weight: inherit
}

a {
color: inherit;
-webkit-text-decoration: inherit;
text-decoration: inherit
}

b,
strong {
font-weight: bolder
}

code,
kbd,
samp,
pre {
font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
font-feature-settings: var(--default-mono-font-feature-settings, normal);
font-variation-settings: var(--default-mono-font-variation-settings, normal);
font-size: 1em
}

small {
font-size: 80%
}

sub,
sup {
vertical-align: baseline;
font-size: 75%;
line-height: 0;
position: relative
}

sub {
bottom: -.25em
}

sup {
top: -.5em
}

table {
text-indent: 0;
border-color: inherit;
border-collapse: collapse
}

:-moz-focusring {
outline: auto
}

progress {
vertical-align: baseline
}

summary {
display: list-item
}

ol,
ul,
menu {
list-style: none
}

img,
svg,
video,
canvas,
audio,
iframe,
embed,
object {
vertical-align: middle;
display: block
}

img,
video {
max-width: 100%;
height: auto
}

button,
input,
select,
optgroup,
textarea {
font: inherit;
font-feature-settings: inherit;
font-variation-settings: inherit;
letter-spacing: inherit;
color: inherit;
opacity: 1;
background-color: #0000;
border-radius: 0
}

::file-selector-button {
font: inherit;
font-feature-settings: inherit;
font-variation-settings: inherit;
letter-spacing: inherit;
color: inherit;
opacity: 1;
background-color: #0000;
border-radius: 0
}

:where(select:is([multiple], [size])) optgroup {
font-weight: bolder
}

:where(select:is([multiple], [size])) optgroup option {
padding-inline-start: 20px
}

::file-selector-button {
margin-inline-end: 4px
}

::placeholder {
opacity: 1
}

@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px) {
::placeholder {
  color: currentColor
}

@supports (color:color-mix(in lab, red, red)) {
  ::placeholder {
    color: color-mix(in oklab, currentcolor 50%, transparent)
  }
}
}

textarea {
resize: vertical
}

::-webkit-search-decoration {
-webkit-appearance: none
}

::-webkit-date-and-time-value {
min-height: 1lh;
text-align: inherit
}

::-webkit-datetime-edit {
display: inline-flex
}

::-webkit-datetime-edit-fields-wrapper {
padding: 0
}

::-webkit-datetime-edit {
padding-block: 0
}

::-webkit-datetime-edit-year-field {
padding-block: 0
}

::-webkit-datetime-edit-month-field {
padding-block: 0
}

::-webkit-datetime-edit-day-field {
padding-block: 0
}

::-webkit-datetime-edit-hour-field {
padding-block: 0
}

::-webkit-datetime-edit-minute-field {
padding-block: 0
}

::-webkit-datetime-edit-second-field {
padding-block: 0
}

::-webkit-datetime-edit-millisecond-field {
padding-block: 0
}

::-webkit-datetime-edit-meridiem-field {
padding-block: 0
}

:-moz-ui-invalid {
box-shadow: none
}

button,
input:where([type=button], [type=reset], [type=submit]) {
appearance: button
}

::file-selector-button {
appearance: button
}

::-webkit-inner-spin-button {
height: auto
}

::-webkit-outer-spin-button {
height: auto
}

[hidden]:where(:not([hidden=until-found])) {
display: none !important
}

button:not(:disabled),
[role=button]:not(:disabled) {
cursor: pointer
}
}

@layer components;

@layer utilities {
.pointer-events-none {
pointer-events: none
}

.collapse {
visibility: collapse
}

.invisible {
visibility: hidden
}

.visible {
visibility: visible
}

.sr-only {
clip: rect(0, 0, 0, 0);
white-space: nowrap;
border-width: 0;
width: 1px;
height: 1px;
margin: -1px;
padding: 0;
position: absolute;
overflow: hidden
}

.absolute {
position: absolute
}

.fixed {
position: fixed
}

.relative {
position: relative
}

.inset-0 {
inset: calc(var(--spacing)*0)
}

.top-0 {
top: calc(var(--spacing)*0)
}

.top-0\.5 {
top: calc(var(--spacing)*.5)
}

.top-8 {
top: calc(var(--spacing)*8)
}

.right-0 {
right: calc(var(--spacing)*0)
}

.right-0\.5 {
right: calc(var(--spacing)*.5)
}

.right-1 {
right: calc(var(--spacing)*1)
}

.bottom-0 {
bottom: calc(var(--spacing)*0)
}

.left-0 {
left: calc(var(--spacing)*0)
}

.left-1 {
left: calc(var(--spacing)*1)
}

.-z-10 {
z-index: -10
}

.z-0 {
z-index: 0
}

.z-10 {
z-index: 10
}

.z-\[9999999\] {
z-index: 9999999
}

.m-2\.5 {
margin: calc(var(--spacing)*2.5)
}

.m-3 {
margin: calc(var(--spacing)*3)
}

.m-auto {
margin: auto
}

.-mx-1 {
margin-inline: calc(var(--spacing)*-1)
}

.mx-2 {
margin-inline: calc(var(--spacing)*2)
}

.mx-\[-5px\] {
margin-inline: -5px
}

.my-1 {
margin-block: calc(var(--spacing)*1)
}

.my-4 {
margin-block: calc(var(--spacing)*4)
}

.my-\[-1px\] {
margin-block: -1px
}

.my-auto {
margin-block: auto
}

.me-5 {
margin-inline-end: calc(var(--spacing)*5)
}

.mt-1 {
margin-top: calc(var(--spacing)*1)
}

.mt-2 {
margin-top: calc(var(--spacing)*2)
}

.mr-1 {
margin-right: calc(var(--spacing)*1)
}

.mb-1 {
margin-bottom: calc(var(--spacing)*1)
}

.mb-2 {
margin-bottom: calc(var(--spacing)*2)
}

.mb-3 {
margin-bottom: calc(var(--spacing)*3)
}

.ml-1 {
margin-left: calc(var(--spacing)*1)
}

.ml-2 {
margin-left: calc(var(--spacing)*2)
}

.ml-4 {
margin-left: calc(var(--spacing)*4)
}

.ml-\[42px\] {
margin-left: 42px
}

.scrollbar::-webkit-scrollbar {
background-color: #0000;
width: 6px;
height: 6px
}

.scrollbar::-webkit-scrollbar-corner {
display: none
}

.scrollbar::-webkit-scrollbar-thumb {
border-radius: 3px
}

.scrollbar::-webkit-scrollbar-thumb {
background-color: var(--outline)
}

@supports (color:color-mix(in lab, red, red)) {
.scrollbar::-webkit-scrollbar-thumb {
  background-color: color-mix(in oklab, var(--outline) 50%, transparent)
}
}

.scrollbar::-webkit-scrollbar-thumb:hover {
background-color: var(--outline)
}

@supports (color:color-mix(in lab, red, red)) {
.scrollbar::-webkit-scrollbar-thumb:hover {
  background-color: color-mix(in oklab, var(--outline) 70%, transparent)
}
}

.line-clamp-1 {
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
display: -webkit-box;
overflow: hidden
}

.scrollbar-hidden {
scrollbar-width: none
}

.scrollbar-hidden::-webkit-scrollbar {
display: none
}

.scrollbar-hidden::-webkit-scrollbar-corner {
display: none
}

.scrollbar-hidden::-webkit-scrollbar-thumb {
background-color: #0000
}

.block {
display: block
}

.flex {
display: flex
}

.hidden {
display: none
}

.inline {
display: inline
}

.inline-block {
display: inline-block
}

.inline-flex {
display: inline-flex
}

.size-4 {
width: calc(var(--spacing)*4);
height: calc(var(--spacing)*4)
}

.size-5 {
width: calc(var(--spacing)*5);
height: calc(var(--spacing)*5)
}

.size-6 {
width: calc(var(--spacing)*6);
height: calc(var(--spacing)*6)
}

.size-7 {
width: calc(var(--spacing)*7);
height: calc(var(--spacing)*7)
}

.size-8 {
width: calc(var(--spacing)*8);
height: calc(var(--spacing)*8)
}

.size-9 {
width: calc(var(--spacing)*9);
height: calc(var(--spacing)*9)
}

.size-10 {
width: calc(var(--spacing)*10);
height: calc(var(--spacing)*10)
}

.size-11 {
width: calc(var(--spacing)*11);
height: calc(var(--spacing)*11)
}

.size-12 {
width: calc(var(--spacing)*12);
height: calc(var(--spacing)*12)
}

.size-32 {
width: calc(var(--spacing)*32);
height: calc(var(--spacing)*32)
}

.size-\[18px\] {
width: 18px;
height: 18px
}

.size-fit {
width: fit-content;
height: fit-content
}

.size-full {
width: 100%;
height: 100%
}

.h-2 {
height: calc(var(--spacing)*2)
}

.h-4 {
height: calc(var(--spacing)*4)
}

.h-7 {
height: calc(var(--spacing)*7)
}

.h-8 {
height: calc(var(--spacing)*8)
}

.h-10 {
height: calc(var(--spacing)*10)
}

.h-14 {
height: calc(var(--spacing)*14)
}

.h-24 {
height: calc(var(--spacing)*24)
}

.h-\[6px\] {
height: 6px
}

.h-\[calc\(100\%-106px\)\] {
height: calc(100% - 106px)
}

.h-fit {
height: fit-content
}

.h-full {
height: 100%
}

.h-min {
height: min-content
}

.h-px {
height: 1px
}

.h-screen {
height: 100vh
}

.max-h-64 {
max-height: calc(var(--spacing)*64)
}

.max-h-72 {
max-height: calc(var(--spacing)*72)
}

.max-h-80 {
max-height: calc(var(--spacing)*80)
}

.max-h-96 {
max-height: calc(var(--spacing)*96)
}

.min-h-2\.5 {
min-height: calc(var(--spacing)*2.5)
}

.min-h-screen {
min-height: 100vh
}

.w-2 {
width: calc(var(--spacing)*2)
}

.w-8 {
width: calc(var(--spacing)*8)
}

.w-10 {
width: calc(var(--spacing)*10)
}

.w-14 {
width: calc(var(--spacing)*14)
}

.w-24 {
width: calc(var(--spacing)*24)
}

.w-44 {
width: calc(var(--spacing)*44)
}

.w-52 {
width: calc(var(--spacing)*52)
}

.w-\[12px\] {
width: 12px
}

.w-\[26px\] {
width: 26px
}

.w-\[52px\] {
width: 52px
}

.w-\[550px\] {
width: 550px
}

.w-fit {
width: fit-content
}

.w-full {
width: 100%
}

.w-min {
width: min-content
}

.max-w-7xl {
max-width: var(--container-7xl)
}

.max-w-\[210px\] {
max-width: 210px
}

.max-w-xl {
max-width: var(--container-xl)
}

.min-w-\[360px\] {
min-width: 360px
}

.shrink-0 {
flex-shrink: 0
}

.table-auto {
table-layout: auto
}

.caption-bottom {
caption-side: bottom
}

.scale-50 {
--tw-scale-x: 50%;
--tw-scale-y: 50%;
--tw-scale-z: 50%;
scale: var(--tw-scale-x) var(--tw-scale-y)
}

.-scale-y-100 {
--tw-scale-y: -100%;
scale: var(--tw-scale-x) var(--tw-scale-y)
}

.transform {
transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, )
}

.animate-spin {
animation: var(--animate-spin)
}

.cursor-default {
cursor: default
}

.cursor-grabbing {
cursor: grabbing
}

.cursor-move {
cursor: move
}

.cursor-pointer {
cursor: pointer
}

.resize {
resize: both
}

.resize-none {
resize: none
}

.list-inside {
list-style-position: inside
}

.list-disc {
list-style-type: disc
}

.list-none {
list-style-type: none
}

.flex-col {
flex-direction: column
}

.flex-row {
flex-direction: row
}

.flex-wrap {
flex-wrap: wrap
}

.items-center {
align-items: center
}

.items-start {
align-items: flex-start
}

.justify-between {
justify-content: space-between
}

.justify-center {
justify-content: center
}

.justify-end {
justify-content: flex-end
}

.justify-start {
justify-content: flex-start
}

.gap-0\.5 {
gap: calc(var(--spacing)*.5)
}

.gap-1 {
gap: calc(var(--spacing)*1)
}

.gap-2 {
gap: calc(var(--spacing)*2)
}

.gap-3 {
gap: calc(var(--spacing)*3)
}

.gap-4 {
gap: calc(var(--spacing)*4)
}

.gap-6 {
gap: calc(var(--spacing)*6)
}

.gap-\[1px\] {
gap: 1px
}

:where(.space-y-3>:not(:last-child)) {
--tw-space-y-reverse: 0;
margin-block-start: calc(calc(var(--spacing)*3)*var(--tw-space-y-reverse));
margin-block-end: calc(calc(var(--spacing)*3)*calc(1 - var(--tw-space-y-reverse)))
}

.self-start {
align-self: flex-start
}

.truncate {
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden
}

.overflow-hidden {
overflow: hidden
}

.overflow-x-hidden {
overflow-x: hidden
}

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

.rounded {
border-radius: .25rem
}

.rounded-2xl {
border-radius: var(--radius-2xl)
}

.rounded-3xl {
border-radius: var(--radius-3xl)
}

.rounded-\[14px\] {
border-radius: 14px
}

.rounded-\[16px\] {
border-radius: 16px
}

.rounded-\[18px\] {
border-radius: 18px
}

.rounded-\[20px\] {
border-radius: 20px
}

.rounded-full {
border-radius: 3.40282e38px
}

.rounded-lg {
border-radius: var(--radius-lg)
}

.rounded-md {
border-radius: var(--radius-md)
}

.rounded-xl {
border-radius: var(--radius-xl)
}

.rounded-xs {
border-radius: var(--radius-xs)
}

.border {
border-style: var(--tw-border-style);
border-width: 1px
}

.border-2 {
border-style: var(--tw-border-style);
border-width: 2px
}

.border-x-0 {
border-inline-style: var(--tw-border-style);
border-inline-width: 0
}

.border-t {
border-top-style: var(--tw-border-style);
border-top-width: 1px
}

.border-t-0 {
border-top-style: var(--tw-border-style);
border-top-width: 0
}

.border-b {
border-bottom-style: var(--tw-border-style);
border-bottom-width: 1px
}

.border-color-on-surface-variant {
border-color: var(--on-surface-variant, oklch(55.1%.027 264.364))
}

@supports (color:color-mix(in lab, red, red)) {
.border-color-on-surface-variant {
  border-color: color-mix(in oklab, var(--on-surface-variant, var(--color-gray-500)) var(--alpha-border, 100%), transparent)
}
}

.border-color-outline {
border-color: var(--outline, oklch(55.1%.027 264.364))
}

@supports (color:color-mix(in lab, red, red)) {
.border-color-outline {
  border-color: color-mix(in oklab, var(--outline, var(--color-gray-500)) var(--alpha-border, 100%), transparent)
}
}

.border-color-outline-variant {
border-color: var(--outline-variant, oklch(70.7%.022 261.325))
}

@supports (color:color-mix(in lab, red, red)) {
.border-color-outline-variant {
  border-color: color-mix(in oklab, var(--outline-variant, var(--color-gray-400)) var(--alpha-border, 100%), transparent)
}
}

.border-color-surface-high {
border-color: var(--surface-high, oklch(92.8%.006 264.531))
}

@supports (color:color-mix(in lab, red, red)) {
.border-color-surface-high {
  border-color: color-mix(in oklab, var(--surface-high, var(--color-gray-200)) var(--alpha-border, 100%), transparent)
}
}

.border-gray-300 {
border-color: var(--color-gray-300)
}

.border-gray-500 {
border-color: var(--color-gray-500)
}

.border-transparent {
border-color: #0000
}

.bg-color-error\/100 {
--alpha-bg: 100%;
background-color: var(--error, oklch(63.7%.237 25.331))
}

@supports (color:color-mix(in lab, red, red)) {
.bg-color-error\/100 {
  background-color: color-mix(in oklab, var(--error, var(--color-red-500)) var(--alpha-bg, 100%), transparent)
}
}

.bg-color-primary\/10 {
--alpha-bg: 10%;
background-color: var(--primary, oklch(42.4%.199 265.638))
}

@supports (color:color-mix(in lab, red, red)) {
.bg-color-primary\/10 {
  background-color: color-mix(in oklab, var(--primary, var(--color-blue-800)) var(--alpha-bg, 100%), transparent)
}
}

.bg-color-primary\/15 {
--alpha-bg: 15%;
background-color: var(--primary, oklch(42.4%.199 265.638))
}

@supports (color:color-mix(in lab, red, red)) {
.bg-color-primary\/15 {
  background-color: color-mix(in oklab, var(--primary, var(--color-blue-800)) var(--alpha-bg, 100%), transparent)
}
}

.bg-color-primary\/100 {
--alpha-bg: 100%;
background-color: var(--primary, oklch(42.4%.199 265.638))
}

@supports (color:color-mix(in lab, red, red)) {
.bg-color-primary\/100 {
  background-color: color-mix(in oklab, var(--primary, var(--color-blue-800)) var(--alpha-bg, 100%), transparent)
}
}

.bg-color-outline {
background-color: var(--outline, oklch(55.1%.027 264.364))
}

@supports (color:color-mix(in lab, red, red)) {
.bg-color-outline {
  background-color: color-mix(in oklab, var(--outline, var(--color-gray-500)) var(--alpha-bg, 100%), transparent)
}
}

.bg-color-primary {
background-color: var(--primary, oklch(42.4%.199 265.638))
}

@supports (color:color-mix(in lab, red, red)) {
.bg-color-primary {
  background-color: color-mix(in oklab, var(--primary, var(--color-blue-800)) var(--alpha-bg, 100%), transparent)
}
}

.bg-color-surface {
background-color: var(--surface, #fff)
}

@supports (color:color-mix(in lab, red, red)) {
.bg-color-surface {
  background-color: color-mix(in oklab, var(--surface, var(--color-white)) var(--alpha-bg, 100%), transparent)
}
}

.bg-color-surface-container {
background-color: var(--surface-container, oklch(96.7%.003 264.542))
}

@supports (color:color-mix(in lab, red, red)) {
.bg-color-surface-container {
  background-color: color-mix(in oklab, var(--surface-container, var(--color-gray-100)) var(--alpha-bg, 100%), transparent)
}
}

.bg-color-surface-high {
background-color: var(--surface-high, oklch(92.8%.006 264.531))
}

@supports (color:color-mix(in lab, red, red)) {
.bg-color-surface-high {
  background-color: color-mix(in oklab, var(--surface-high, var(--color-gray-200)) var(--alpha-bg, 100%), transparent)
}
}

.bg-gray-200 {
background-color: var(--color-gray-200)
}

.bg-gray-500 {
background-color: var(--color-gray-500)
}

.bg-transparent {
background-color: #0000
}

.bg-white {
background-color: var(--color-white)
}

.fill-color-on-surface-variant {
fill: var(--on-surface-variant, oklch(55.1%.027 264.364))
}

@supports (color:color-mix(in lab, red, red)) {
.fill-color-on-surface-variant {
  fill: color-mix(in oklab, var(--on-surface-variant, var(--color-gray-500)) var(--alpha-fill, 100%), transparent)
}
}

.fill-color-primary {
fill: var(--primary, oklch(42.4%.199 265.638))
}

@supports (color:color-mix(in lab, red, red)) {
.fill-color-primary {
  fill: color-mix(in oklab, var(--primary, var(--color-blue-800)) var(--alpha-fill, 100%), transparent)
}
}

.fill-current {
fill: currentColor
}

.fill-none {
fill: none
}

.stroke-none {
stroke: none
}

.p-0 {
padding: calc(var(--spacing)*0)
}

.p-0\.5 {
padding: calc(var(--spacing)*.5)
}

.p-1 {
padding: calc(var(--spacing)*1)
}

.p-1\.5 {
padding: calc(var(--spacing)*1.5)
}

.p-2 {
padding: calc(var(--spacing)*2)
}

.p-2\.5 {
padding: calc(var(--spacing)*2.5)
}

.p-4 {
padding: calc(var(--spacing)*4)
}

.p-5 {
padding: calc(var(--spacing)*5)
}

.p-6 {
padding: calc(var(--spacing)*6)
}

.px-1 {
padding-inline: calc(var(--spacing)*1)
}

.px-1\.5 {
padding-inline: calc(var(--spacing)*1.5)
}

.px-2 {
padding-inline: calc(var(--spacing)*2)
}

.px-2\.5 {
padding-inline: calc(var(--spacing)*2.5)
}

.px-3 {
padding-inline: calc(var(--spacing)*3)
}

.px-4 {
padding-inline: calc(var(--spacing)*4)
}

.px-6 {
padding-inline: calc(var(--spacing)*6)
}

.px-12 {
padding-inline: calc(var(--spacing)*12)
}

.px-\[5px\] {
padding-inline: 5px
}

.py-0\.5 {
padding-block: calc(var(--spacing)*.5)
}

.py-1 {
padding-block: calc(var(--spacing)*1)
}

.py-1\.5 {
padding-block: calc(var(--spacing)*1.5)
}

.py-2 {
padding-block: calc(var(--spacing)*2)
}

.py-4 {
padding-block: calc(var(--spacing)*4)
}

.py-\[1px\] {
padding-block: 1px
}

.py-\[2px\] {
padding-block: 2px
}

.pr-2 {
padding-right: calc(var(--spacing)*2)
}

.pr-2\.5 {
padding-right: calc(var(--spacing)*2.5)
}

.pr-4 {
padding-right: calc(var(--spacing)*4)
}

.pr-9 {
padding-right: calc(var(--spacing)*9)
}

.pr-10 {
padding-right: calc(var(--spacing)*10)
}

.pb-1 {
padding-bottom: calc(var(--spacing)*1)
}

.pb-2 {
padding-bottom: calc(var(--spacing)*2)
}

.pb-4 {
padding-bottom: calc(var(--spacing)*4)
}

.pl-1 {
padding-left: calc(var(--spacing)*1)
}

.pl-2 {
padding-left: calc(var(--spacing)*2)
}

.pl-3 {
padding-left: calc(var(--spacing)*3)
}

.pl-6 {
padding-left: calc(var(--spacing)*6)
}

.text-center {
text-align: center
}

.text-end {
text-align: end
}

.text-start {
text-align: start
}

.align-top {
vertical-align: top
}

.font-mono {
font-family: var(--font-mono)
}

.text-2xl {
font-size: var(--text-2xl);
line-height: var(--tw-leading, var(--text-2xl--line-height))
}

.text-base {
font-size: var(--text-base);
line-height: var(--tw-leading, var(--text-base--line-height))
}

.text-lg {
font-size: var(--text-lg);
line-height: var(--tw-leading, var(--text-lg--line-height))
}

.text-sm {
font-size: var(--text-sm);
line-height: var(--tw-leading, var(--text-sm--line-height))
}

.text-xl {
font-size: var(--text-xl);
line-height: var(--tw-leading, var(--text-xl--line-height))
}

.text-xs {
font-size: var(--text-xs);
line-height: var(--tw-leading, var(--text-xs--line-height))
}

.leading-0 {
--tw-leading: calc(var(--spacing)*0);
line-height: calc(var(--spacing)*0)
}

.leading-\[0\] {
--tw-leading: 0;
line-height: 0
}

.font-bold {
--tw-font-weight: var(--font-weight-bold);
font-weight: var(--font-weight-bold)
}

.font-medium {
--tw-font-weight: var(--font-weight-medium);
font-weight: var(--font-weight-medium)
}

.whitespace-nowrap {
white-space: nowrap
}

.whitespace-pre-line {
white-space: pre-line
}

.text-amber-600 {
color: var(--color-amber-600)
}

.text-blue-600 {
color: var(--color-blue-600)
}

.text-color-on-error {
color: var(--on-error, #fff)
}

@supports (color:color-mix(in lab, red, red)) {
.text-color-on-error {
  color: color-mix(in oklab, var(--on-error, var(--color-white)) var(--alpha-text, 100%), transparent)
}
}

.text-color-on-primary {
color: var(--on-primary, #fff)
}

@supports (color:color-mix(in lab, red, red)) {
.text-color-on-primary {
  color: color-mix(in oklab, var(--on-primary, var(--color-white)) var(--alpha-text, 100%), transparent)
}
}

.text-color-on-surface {
color: var(--on-surface, oklch(21%.034 264.665))
}

@supports (color:color-mix(in lab, red, red)) {
.text-color-on-surface {
  color: color-mix(in oklab, var(--on-surface, var(--color-gray-900)) var(--alpha-text, 100%), transparent)
}
}

.text-color-on-surface-variant {
color: var(--on-surface-variant, oklch(55.1%.027 264.364))
}

@supports (color:color-mix(in lab, red, red)) {
.text-color-on-surface-variant {
  color: color-mix(in oklab, var(--on-surface-variant, var(--color-gray-500)) var(--alpha-text, 100%), transparent)
}
}

.text-color-primary {
color: var(--primary, oklch(42.4%.199 265.638))
}

@supports (color:color-mix(in lab, red, red)) {
.text-color-primary {
  color: color-mix(in oklab, var(--primary, var(--color-blue-800)) var(--alpha-text, 100%), transparent)
}
}

.text-gray-500 {
color: var(--color-gray-500)
}

.text-gray-900 {
color: var(--color-gray-900)
}

.text-green-300 {
color: var(--color-green-300)
}

.text-green-500 {
color: var(--color-green-500)
}

.text-red-500 {
color: var(--color-red-500)
}

.text-red-600 {
color: var(--color-red-600)
}

.text-transparent {
color: #0000
}

.capitalize {
text-transform: capitalize
}

.uppercase {
text-transform: uppercase
}

.italic {
font-style: italic
}

.underline {
text-decoration-line: underline
}

.opacity-0 {
opacity: 0
}

.shadow {
--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, #0000001a), 0 1px 2px -1px var(--tw-shadow-color, #0000001a);
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
}

.shadow-lg {
--tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, #0000001a), 0 4px 6px -4px var(--tw-shadow-color, #0000001a);
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
}

.shadow-xl {
--tw-shadow: 0 20px 25px -5px var(--tw-shadow-color, #0000001a), 0 8px 10px -6px var(--tw-shadow-color, #0000001a);
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
}

.ring-\[6px\] {
--tw-ring-shadow: var(--tw-ring-inset, )0 0 0 calc(6px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
}

.ring-transparent {
--tw-ring-color: transparent
}

.outline {
outline-style: var(--tw-outline-style);
outline-width: 1px
}

.outline-color-error {
outline-color: var(--error, oklch(63.7%.237 25.331))
}

@supports (color:color-mix(in lab, red, red)) {
.outline-color-error {
  outline-color: color-mix(in oklab, var(--error, var(--color-red-500)) var(--alpha-outline, 100%), transparent)
}
}

.outline-color-primary {
outline-color: var(--primary, oklch(42.4%.199 265.638))
}

@supports (color:color-mix(in lab, red, red)) {
.outline-color-primary {
  outline-color: color-mix(in oklab, var(--primary, var(--color-blue-800)) var(--alpha-outline, 100%), transparent)
}
}

.transition-\[background-color\,_transform\] {
transition-property: background-color, transform;
transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
transition-duration: var(--tw-duration, var(--default-transition-duration))
}

.transition-all {
transition-property: all;
transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
transition-duration: var(--tw-duration, var(--default-transition-duration))
}

.transition-colors {
transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
transition-duration: var(--tw-duration, var(--default-transition-duration))
}

.transition-opacity {
transition-property: opacity;
transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
transition-duration: var(--tw-duration, var(--default-transition-duration))
}

.transition-transform {
transition-property: transform, translate, scale, rotate;
transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
transition-duration: var(--tw-duration, var(--default-transition-duration))
}

.duration-300 {
--tw-duration: .3s;
transition-duration: .3s
}

.ease-\[cubic-bezier\(0\.175\,0\.885\,0\.32\,1\.275\)\] {
--tw-ease: cubic-bezier(.175, .885, .32, 1.275);
transition-timing-function: cubic-bezier(.175, .885, .32, 1.275)
}

.outline-none {
--tw-outline-style: none;
outline-style: none
}

.select-auto {
-webkit-user-select: auto;
user-select: auto
}

.select-none {
-webkit-user-select: none;
user-select: none
}

.switch-transitions {
transition: background-color .1s linear, width .1s linear, height .1s linear, margin .3s cubic-bezier(.175, .885, .32, 1.275)
}

@media (hover:hover) {
.group-hover\:border-color-on-surface:is(:where(.group):hover *) {
  border-color: var(--on-surface, oklch(21%.034 264.665))
}

@supports (color:color-mix(in lab, red, red)) {
  .group-hover\:border-color-on-surface:is(:where(.group):hover *) {
    border-color: color-mix(in oklab, var(--on-surface, var(--color-gray-900)) var(--alpha-border, 100%), transparent)
  }
}

.group-hover\:bg-color-on-surface-variant\/15:is(:where(.group):hover *) {
  --alpha-bg: 15%;
  background-color: var(--on-surface-variant, oklch(55.1%.027 264.364))
}

@supports (color:color-mix(in lab, red, red)) {
  .group-hover\:bg-color-on-surface-variant\/15:is(:where(.group):hover *) {
    background-color: color-mix(in oklab, var(--on-surface-variant, var(--color-gray-500)) var(--alpha-bg, 100%), transparent)
  }
}

.group-hover\:fill-color-on-surface:is(:where(.group):hover *) {
  fill: var(--on-surface, oklch(21%.034 264.665))
}

@supports (color:color-mix(in lab, red, red)) {
  .group-hover\:fill-color-on-surface:is(:where(.group):hover *) {
    fill: color-mix(in oklab, var(--on-surface, var(--color-gray-900)) var(--alpha-fill, 100%), transparent)
  }
}

.group-hover\/label\:border-color-on-surface:is(:where(.group\/label):hover *) {
  border-color: var(--on-surface, oklch(21%.034 264.665))
}

@supports (color:color-mix(in lab, red, red)) {
  .group-hover\/label\:border-color-on-surface:is(:where(.group\/label):hover *) {
    border-color: color-mix(in oklab, var(--on-surface, var(--color-gray-900)) var(--alpha-border, 100%), transparent)
  }
}

.group-hover\/label\:fill-color-on-surface:is(:where(.group\/label):hover *) {
  fill: var(--on-surface, oklch(21%.034 264.665))
}

@supports (color:color-mix(in lab, red, red)) {
  .group-hover\/label\:fill-color-on-surface:is(:where(.group\/label):hover *) {
    fill: color-mix(in oklab, var(--on-surface, var(--color-gray-900)) var(--alpha-fill, 100%), transparent)
  }
}

.group-hover\/track\:bg-color-on-surface-variant\/15:is(:where(.group\/track):hover *) {
  --alpha-bg: 15%;
  background-color: var(--on-surface-variant, oklch(55.1%.027 264.364))
}

@supports (color:color-mix(in lab, red, red)) {
  .group-hover\/track\:bg-color-on-surface-variant\/15:is(:where(.group\/track):hover *) {
    background-color: color-mix(in oklab, var(--on-surface-variant, var(--color-gray-500)) var(--alpha-bg, 100%), transparent)
  }
}

.group-hover\/track\:bg-color-on-surface-variant:is(:where(.group\/track):hover *) {
  background-color: var(--on-surface-variant, oklch(55.1%.027 264.364))
}

@supports (color:color-mix(in lab, red, red)) {
  .group-hover\/track\:bg-color-on-surface-variant:is(:where(.group\/track):hover *) {
    background-color: color-mix(in oklab, var(--on-surface-variant, var(--color-gray-500)) var(--alpha-bg, 100%), transparent)
  }
}
}

.group-has-checked\:visible:is(:where(.group):has(:checked) *) {
visibility: visible
}

.group-has-checked\:ms-5:is(:where(.group):has(:checked) *) {
margin-inline-start: calc(var(--spacing)*5)
}

.group-has-checked\:me-0:is(:where(.group):has(:checked) *) {
margin-inline-end: calc(var(--spacing)*0)
}

.group-has-checked\:size-6:is(:where(.group):has(:checked) *) {
width: calc(var(--spacing)*6);
height: calc(var(--spacing)*6)
}

.group-has-checked\:border-color-primary:is(:where(.group):has(:checked) *) {
border-color: var(--primary, oklch(42.4%.199 265.638))
}

@supports (color:color-mix(in lab, red, red)) {
.group-has-checked\:border-color-primary:is(:where(.group):has(:checked) *) {
  border-color: color-mix(in oklab, var(--primary, var(--color-blue-800)) var(--alpha-border, 100%), transparent)
}
}

.group-has-checked\:bg-color-on-primary\/100:is(:where(.group):has(:checked) *) {
--alpha-bg: 100%;
background-color: var(--on-primary, #fff)
}

@supports (color:color-mix(in lab, red, red)) {
.group-has-checked\:bg-color-on-primary\/100:is(:where(.group):has(:checked) *) {
  background-color: color-mix(in oklab, var(--on-primary, var(--color-white)) var(--alpha-bg, 100%), transparent)
}
}

.group-has-checked\:bg-color-primary:is(:where(.group):has(:checked) *) {
background-color: var(--primary, oklch(42.4%.199 265.638))
}

@supports (color:color-mix(in lab, red, red)) {
.group-has-checked\:bg-color-primary:is(:where(.group):has(:checked) *) {
  background-color: color-mix(in oklab, var(--primary, var(--color-blue-800)) var(--alpha-bg, 100%), transparent)
}
}

@media (hover:hover) {
.group-has-checked\:group-hover\/track\:bg-color-primary\/15:is(:where(.group):has(:checked) *):is(:where(.group\/track):hover *) {
  --alpha-bg: 15%;
  background-color: var(--primary, oklch(42.4%.199 265.638))
}

@supports (color:color-mix(in lab, red, red)) {
  .group-has-checked\:group-hover\/track\:bg-color-primary\/15:is(:where(.group):has(:checked) *):is(:where(.group\/track):hover *) {
    background-color: color-mix(in oklab, var(--primary, var(--color-blue-800)) var(--alpha-bg, 100%), transparent)
  }
}

.group-has-active\:group-hover\/track\:size-7:is(:where(.group):has(:active) *):is(:where(.group\/track):hover *) {
  width: calc(var(--spacing)*7);
  height: calc(var(--spacing)*7)
}

.group-has-active\:group-hover\/track\:bg-color-on-surface-variant\/25:is(:where(.group):has(:active) *):is(:where(.group\/track):hover *) {
  --alpha-bg: 25%;
  background-color: var(--on-surface-variant, oklch(55.1%.027 264.364))
}

@supports (color:color-mix(in lab, red, red)) {
  .group-has-active\:group-hover\/track\:bg-color-on-surface-variant\/25:is(:where(.group):has(:active) *):is(:where(.group\/track):hover *) {
    background-color: color-mix(in oklab, var(--on-surface-variant, var(--color-gray-500)) var(--alpha-bg, 100%), transparent)
  }
}

.group-has-checked\:group-has-active\:group-hover\/track\:bg-color-primary\/25:is(:where(.group):has(:checked) *):is(:where(.group):has(:active) *):is(:where(.group\/track):hover *) {
  --alpha-bg: 25%;
  background-color: var(--primary, oklch(42.4%.199 265.638))
}

@supports (color:color-mix(in lab, red, red)) {
  .group-has-checked\:group-has-active\:group-hover\/track\:bg-color-primary\/25:is(:where(.group):has(:checked) *):is(:where(.group):has(:active) *):is(:where(.group\/track):hover *) {
    background-color: color-mix(in oklab, var(--primary, var(--color-blue-800)) var(--alpha-bg, 100%), transparent)
  }
}
}

.peer-checked\:h-3:is(:where(.peer):checked~*) {
height: calc(var(--spacing)*3)
}

.peer-checked\:w-3:is(:where(.peer):checked~*) {
width: calc(var(--spacing)*3)
}

.peer-checked\:translate-x-2:is(:where(.peer):checked~*) {
--tw-translate-x: calc(var(--spacing)*2);
translate: var(--tw-translate-x) var(--tw-translate-y)
}

.peer-checked\:scale-100:is(:where(.peer):checked~*) {
--tw-scale-x: 100%;
--tw-scale-y: 100%;
--tw-scale-z: 100%;
scale: var(--tw-scale-x) var(--tw-scale-y)
}

.peer-checked\:animate-circle-grow:is(:where(.peer):checked~*) {
animation: var(--animate-circle-grow)
}

.peer-checked\:border-color-primary:is(:where(.peer):checked~*) {
border-color: var(--primary, oklch(42.4%.199 265.638))
}

@supports (color:color-mix(in lab, red, red)) {
.peer-checked\:border-color-primary:is(:where(.peer):checked~*) {
  border-color: color-mix(in oklab, var(--primary, var(--color-blue-800)) var(--alpha-border, 100%), transparent)
}
}

.peer-checked\:border-purple-800:is(:where(.peer):checked~*) {
border-color: var(--color-purple-800)
}

.peer-checked\:bg-color-primary:is(:where(.peer):checked~*) {
background-color: var(--primary, oklch(42.4%.199 265.638))
}

@supports (color:color-mix(in lab, red, red)) {
.peer-checked\:bg-color-primary:is(:where(.peer):checked~*) {
  background-color: color-mix(in oklab, var(--primary, var(--color-blue-800)) var(--alpha-bg, 100%), transparent)
}
}

.peer-checked\:bg-purple-200:is(:where(.peer):checked~*) {
background-color: var(--color-purple-200)
}

.peer-checked\:bg-purple-800:is(:where(.peer):checked~*) {
background-color: var(--color-purple-800)
}

.peer-checked\:fill-color-on-primary:is(:where(.peer):checked~*) {
fill: var(--on-primary, #fff)
}

@supports (color:color-mix(in lab, red, red)) {
.peer-checked\:fill-color-on-primary:is(:where(.peer):checked~*) {
  fill: color-mix(in oklab, var(--on-primary, var(--color-white)) var(--alpha-fill, 100%), transparent)
}
}

.peer-checked\:fill-color-primary:is(:where(.peer):checked~*) {
fill: var(--primary, oklch(42.4%.199 265.638))
}

@supports (color:color-mix(in lab, red, red)) {
.peer-checked\:fill-color-primary:is(:where(.peer):checked~*) {
  fill: color-mix(in oklab, var(--primary, var(--color-blue-800)) var(--alpha-fill, 100%), transparent)
}
}

.peer-checked\:opacity-100:is(:where(.peer):checked~*) {
opacity: 1
}

.peer-checked\:ring-4:is(:where(.peer):checked~*) {
--tw-ring-shadow: var(--tw-ring-inset, )0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
}

@media (hover:hover) {
.peer-checked\:group-hover\:bg-color-primary\/15:is(:where(.peer):checked~*):is(:where(.group):hover *) {
  --alpha-bg: 15%;
  background-color: var(--primary, oklch(42.4%.199 265.638))
}

@supports (color:color-mix(in lab, red, red)) {
  .peer-checked\:group-hover\:bg-color-primary\/15:is(:where(.peer):checked~*):is(:where(.group):hover *) {
    background-color: color-mix(in oklab, var(--primary, var(--color-blue-800)) var(--alpha-bg, 100%), transparent)
  }
}

.peer-hover\:ring-gray-600\/10:is(:where(.peer):hover~*) {
  --tw-ring-color: #4a55651a
}

@supports (color:color-mix(in lab, red, red)) {
  .peer-hover\:ring-gray-600\/10:is(:where(.peer):hover~*) {
    --tw-ring-color: color-mix(in oklab, var(--color-gray-600) 10%, transparent)
  }
}

.peer-checked\:peer-hover\:ring-purple-800\/10:is(:where(.peer):checked~*):is(:where(.peer):hover~*) {
  --tw-ring-color: #6e11b01a
}

@supports (color:color-mix(in lab, red, red)) {
  .peer-checked\:peer-hover\:ring-purple-800\/10:is(:where(.peer):checked~*):is(:where(.peer):hover~*) {
    --tw-ring-color: color-mix(in oklab, var(--color-purple-800) 10%, transparent)
  }
}
}

.peer-focus-visible\:outline-custom:is(:where(.peer):focus-visible~*) {
outline-style: var(--tw-outline-style);
outline-offset: 2px;
transition-property: outline-offset;
transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
transition-duration: var(--tw-duration, var(--default-transition-duration));
outline-width: 2px
}

.peer-focus-visible\:outline:is(:where(.peer):focus-visible~*) {
outline-style: var(--tw-outline-style);
outline-width: 1px
}

.peer-focus-visible\:outline-offset-2:is(:where(.peer):focus-visible~*) {
outline-offset: 2px
}

.peer-focus-visible\:outline-color-primary:is(:where(.peer):focus-visible~*) {
outline-color: var(--primary, oklch(42.4%.199 265.638))
}

@supports (color:color-mix(in lab, red, red)) {
.peer-focus-visible\:outline-color-primary:is(:where(.peer):focus-visible~*) {
  outline-color: color-mix(in oklab, var(--primary, var(--color-blue-800)) var(--alpha-outline, 100%), transparent)
}
}

.peer-focus-visible\:outline-gray-600:is(:where(.peer):focus-visible~*) {
outline-color: var(--color-gray-600)
}

@media (hover:hover) {
.group-hover\:peer-active\:bg-color-on-surface-variant\/25:is(:where(.group):hover *):is(:where(.peer):active~*) {
  --alpha-bg: 25%;
  background-color: var(--on-surface-variant, oklch(55.1%.027 264.364))
}

@supports (color:color-mix(in lab, red, red)) {
  .group-hover\:peer-active\:bg-color-on-surface-variant\/25:is(:where(.group):hover *):is(:where(.peer):active~*) {
    background-color: color-mix(in oklab, var(--on-surface-variant, var(--color-gray-500)) var(--alpha-bg, 100%), transparent)
  }
}

.peer-checked\:peer-active\:group-hover\:bg-color-primary\/25:is(:where(.peer):checked~*):is(:where(.peer):active~*):is(:where(.group):hover *) {
  --alpha-bg: 25%;
  background-color: var(--primary, oklch(42.4%.199 265.638))
}

@supports (color:color-mix(in lab, red, red)) {
  .peer-checked\:peer-active\:group-hover\:bg-color-primary\/25:is(:where(.peer):checked~*):is(:where(.peer):active~*):is(:where(.group):hover *) {
    background-color: color-mix(in oklab, var(--primary, var(--color-blue-800)) var(--alpha-bg, 100%), transparent)
  }
}
}

.first-letter\:uppercase:first-letter {
text-transform: uppercase
}

.marker\:text-color-on-surface-variant ::marker {
color: var(--on-surface-variant, oklch(55.1%.027 264.364))
}

@supports (color:color-mix(in lab, red, red)) {
.marker\:text-color-on-surface-variant ::marker {
  color: color-mix(in oklab, var(--on-surface-variant, var(--color-gray-500)) var(--alpha-text, 100%), transparent)
}
}

.marker\:text-color-on-surface-variant::marker {
color: var(--on-surface-variant, oklch(55.1%.027 264.364))
}

@supports (color:color-mix(in lab, red, red)) {
.marker\:text-color-on-surface-variant::marker {
  color: color-mix(in oklab, var(--on-surface-variant, var(--color-gray-500)) var(--alpha-text, 100%), transparent)
}
}

.marker\:text-color-on-surface-variant ::-webkit-details-marker {
color: var(--on-surface-variant, oklch(55.1%.027 264.364))
}

@supports (color:color-mix(in lab, red, red)) {
.marker\:text-color-on-surface-variant ::-webkit-details-marker {
  color: color-mix(in oklab, var(--on-surface-variant, var(--color-gray-500)) var(--alpha-text, 100%), transparent)
}
}

.marker\:text-color-on-surface-variant::-webkit-details-marker {
color: var(--on-surface-variant, oklch(55.1%.027 264.364))
}

@supports (color:color-mix(in lab, red, red)) {
.marker\:text-color-on-surface-variant::-webkit-details-marker {
  color: color-mix(in oklab, var(--on-surface-variant, var(--color-gray-500)) var(--alpha-text, 100%), transparent)
}
}

.before\:pointer-events-none:before {
content: var(--tw-content);
pointer-events: none
}

.before\:absolute:before {
content: var(--tw-content);
position: absolute
}

.before\:inset-0:before {
content: var(--tw-content);
inset: calc(var(--spacing)*0)
}

.before\:rounded-full:before {
content: var(--tw-content);
border-radius: 3.40282e38px
}

.before\:border:before {
content: var(--tw-content);
border-style: var(--tw-border-style);
border-width: 1px
}

.before\:border-color-primary\/50:before {
content: var(--tw-content);
--alpha-border: 50%;
border-color: var(--primary, oklch(42.4%.199 265.638))
}

@supports (color:color-mix(in lab, red, red)) {
.before\:border-color-primary\/50:before {
  border-color: color-mix(in oklab, var(--primary, var(--color-blue-800)) var(--alpha-border, 100%), transparent)
}
}

.last\:mb-0:last-child {
margin-bottom: calc(var(--spacing)*0)
}

.last\:border-b-0:last-child {
border-bottom-style: var(--tw-border-style);
border-bottom-width: 0
}

.last\:border-none:last-child {
--tw-border-style: none;
border-style: none
}

.focus-within\:outline-0:focus-within {
outline-style: var(--tw-outline-style);
outline-width: 0
}

@media (hover:hover) {
.hover\:border-color-outline-variant:hover {
  border-color: var(--outline-variant, oklch(70.7%.022 261.325))
}

@supports (color:color-mix(in lab, red, red)) {
  .hover\:border-color-outline-variant:hover {
    border-color: color-mix(in oklab, var(--outline-variant, var(--color-gray-400)) var(--alpha-border, 100%), transparent)
  }
}

.hover\:bg-color-primary\/5:hover {
  --alpha-bg: 5%;
  background-color: var(--primary, oklch(42.4%.199 265.638))
}

@supports (color:color-mix(in lab, red, red)) {
  .hover\:bg-color-primary\/5:hover {
    background-color: color-mix(in oklab, var(--primary, var(--color-blue-800)) var(--alpha-bg, 100%), transparent)
  }
}

.hover\:bg-color-primary\/10:hover {
  --alpha-bg: 10%;
  background-color: var(--primary, oklch(42.4%.199 265.638))
}

@supports (color:color-mix(in lab, red, red)) {
  .hover\:bg-color-primary\/10:hover {
    background-color: color-mix(in oklab, var(--primary, var(--color-blue-800)) var(--alpha-bg, 100%), transparent)
  }
}

.hover\:bg-color-primary\/15:hover {
  --alpha-bg: 15%;
  background-color: var(--primary, oklch(42.4%.199 265.638))
}

@supports (color:color-mix(in lab, red, red)) {
  .hover\:bg-color-primary\/15:hover {
    background-color: color-mix(in oklab, var(--primary, var(--color-blue-800)) var(--alpha-bg, 100%), transparent)
  }
}

.hover\:text-color-primary:hover {
  color: var(--primary, oklch(42.4%.199 265.638))
}

@supports (color:color-mix(in lab, red, red)) {
  .hover\:text-color-primary:hover {
    color: color-mix(in oklab, var(--primary, var(--color-blue-800)) var(--alpha-text, 100%), transparent)
  }
}

.hover\:underline:hover {
  text-decoration-line: underline
}

.not-aria-selected\:hover\:bg-color-primary\/5:not([aria-selected=true]):hover {
  --alpha-bg: 5%;
  background-color: var(--primary, oklch(42.4%.199 265.638))
}

@supports (color:color-mix(in lab, red, red)) {
  .not-aria-selected\:hover\:bg-color-primary\/5:not([aria-selected=true]):hover {
    background-color: color-mix(in oklab, var(--primary, var(--color-blue-800)) var(--alpha-bg, 100%), transparent)
  }
}
}

.focus\:border-color-outline:focus {
border-color: var(--outline, oklch(55.1%.027 264.364))
}

@supports (color:color-mix(in lab, red, red)) {
.focus\:border-color-outline:focus {
  border-color: color-mix(in oklab, var(--outline, var(--color-gray-500)) var(--alpha-border, 100%), transparent)
}
}

.focus\:border-color-outline-variant:focus {
border-color: var(--outline-variant, oklch(70.7%.022 261.325))
}

@supports (color:color-mix(in lab, red, red)) {
.focus\:border-color-outline-variant:focus {
  border-color: color-mix(in oklab, var(--outline-variant, var(--color-gray-400)) var(--alpha-border, 100%), transparent)
}
}

.focus\:bg-color-primary\/5:focus {
--alpha-bg: 5%;
background-color: var(--primary, oklch(42.4%.199 265.638))
}

@supports (color:color-mix(in lab, red, red)) {
.focus\:bg-color-primary\/5:focus {
  background-color: color-mix(in oklab, var(--primary, var(--color-blue-800)) var(--alpha-bg, 100%), transparent)
}
}

.focus\:outline-none:focus {
--tw-outline-style: none;
outline-style: none
}

.focus-visible\:outline-custom:focus-visible {
outline-style: var(--tw-outline-style);
outline-offset: 2px;
transition-property: outline-offset;
transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
transition-duration: var(--tw-duration, var(--default-transition-duration));
outline-width: 2px
}

.focus-visible\:outline-color-primary:focus-visible {
outline-color: var(--primary, oklch(42.4%.199 265.638))
}

@supports (color:color-mix(in lab, red, red)) {
.focus-visible\:outline-color-primary:focus-visible {
  outline-color: color-mix(in oklab, var(--primary, var(--color-blue-800)) var(--alpha-outline, 100%), transparent)
}
}

@media (hover:hover) {
.enabled\:hover\:bg-color-error\/90:enabled:hover {
  --alpha-bg: 90%;
  background-color: var(--error, oklch(63.7%.237 25.331))
}

@supports (color:color-mix(in lab, red, red)) {
  .enabled\:hover\:bg-color-error\/90:enabled:hover {
    background-color: color-mix(in oklab, var(--error, var(--color-red-500)) var(--alpha-bg, 100%), transparent)
  }
}

.enabled\:hover\:bg-color-primary\/10:enabled:hover {
  --alpha-bg: 10%;
  background-color: var(--primary, oklch(42.4%.199 265.638))
}

@supports (color:color-mix(in lab, red, red)) {
  .enabled\:hover\:bg-color-primary\/10:enabled:hover {
    background-color: color-mix(in oklab, var(--primary, var(--color-blue-800)) var(--alpha-bg, 100%), transparent)
  }
}

.enabled\:hover\:bg-color-primary\/90:enabled:hover {
  --alpha-bg: 90%;
  background-color: var(--primary, oklch(42.4%.199 265.638))
}

@supports (color:color-mix(in lab, red, red)) {
  .enabled\:hover\:bg-color-primary\/90:enabled:hover {
    background-color: color-mix(in oklab, var(--primary, var(--color-blue-800)) var(--alpha-bg, 100%), transparent)
  }
}
}

.enabled\:active\:bg-color-error\/80:enabled:active {
--alpha-bg: 80%;
background-color: var(--error, oklch(63.7%.237 25.331))
}

@supports (color:color-mix(in lab, red, red)) {
.enabled\:active\:bg-color-error\/80:enabled:active {
  background-color: color-mix(in oklab, var(--error, var(--color-red-500)) var(--alpha-bg, 100%), transparent)
}
}

.enabled\:active\:bg-color-primary\/20:enabled:active {
--alpha-bg: 20%;
background-color: var(--primary, oklch(42.4%.199 265.638))
}

@supports (color:color-mix(in lab, red, red)) {
.enabled\:active\:bg-color-primary\/20:enabled:active {
  background-color: color-mix(in oklab, var(--primary, var(--color-blue-800)) var(--alpha-bg, 100%), transparent)
}
}

.enabled\:active\:bg-color-primary\/80:enabled:active {
--alpha-bg: 80%;
background-color: var(--primary, oklch(42.4%.199 265.638))
}

@supports (color:color-mix(in lab, red, red)) {
.enabled\:active\:bg-color-primary\/80:enabled:active {
  background-color: color-mix(in oklab, var(--primary, var(--color-blue-800)) var(--alpha-bg, 100%), transparent)
}
}

.disabled\:cursor-default:disabled {
cursor: default
}

.disabled\:opacity-50:disabled {
opacity: .5
}

.has-checked\:border-color-primary:has(:checked) {
border-color: var(--primary, oklch(42.4%.199 265.638))
}

@supports (color:color-mix(in lab, red, red)) {
.has-checked\:border-color-primary:has(:checked) {
  border-color: color-mix(in oklab, var(--primary, var(--color-blue-800)) var(--alpha-border, 100%), transparent)
}
}

.has-focus-visible\:outline-custom:has(:focus-visible) {
outline-style: var(--tw-outline-style);
outline-offset: 2px;
transition-property: outline-offset;
transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
transition-duration: var(--tw-duration, var(--default-transition-duration));
outline-width: 2px
}

.has-focus-visible\:outline-color-primary:has(:focus-visible) {
outline-color: var(--primary, oklch(42.4%.199 265.638))
}

@supports (color:color-mix(in lab, red, red)) {
.has-focus-visible\:outline-color-primary:has(:focus-visible) {
  outline-color: color-mix(in oklab, var(--primary, var(--color-blue-800)) var(--alpha-outline, 100%), transparent)
}
}

.has-disabled\:pointer-events-none:has(:disabled) {
pointer-events: none
}

.has-disabled\:opacity-50:has(:disabled) {
opacity: .5
}

.aria-selected\:bg-color-primary\/10[aria-selected=true] {
--alpha-bg: 10%;
background-color: var(--primary, oklch(42.4%.199 265.638))
}

@supports (color:color-mix(in lab, red, red)) {
.aria-selected\:bg-color-primary\/10[aria-selected=true] {
  background-color: color-mix(in oklab, var(--primary, var(--color-blue-800)) var(--alpha-bg, 100%), transparent)
}
}

.dark\:border-none:where([data-theme=dark], [data-theme=dark] *) {
--tw-border-style: none;
border-style: none
}

.dark\:border-gray-500:where([data-theme=dark], [data-theme=dark] *) {
border-color: var(--color-gray-500)
}

.dark\:bg-gray-500:where([data-theme=dark], [data-theme=dark] *) {
background-color: var(--color-gray-500)
}

.dark\:bg-gray-800:where([data-theme=dark], [data-theme=dark] *) {
background-color: var(--color-gray-800)
}

.dark\:bg-gray-900:where([data-theme=dark], [data-theme=dark] *) {
background-color: var(--color-gray-900)
}

.dark\:text-amber-400:where([data-theme=dark], [data-theme=dark] *) {
color: var(--color-amber-400)
}

.dark\:text-blue-400:where([data-theme=dark], [data-theme=dark] *) {
color: var(--color-blue-400)
}

.dark\:text-gray-300:where([data-theme=dark], [data-theme=dark] *) {
color: var(--color-gray-300)
}

.dark\:text-green-700:where([data-theme=dark], [data-theme=dark] *) {
color: var(--color-green-700)
}

.dark\:text-red-400:where([data-theme=dark], [data-theme=dark] *) {
color: var(--color-red-400)
}

.peer-checked\:dark\:border-purple-200:is(:where(.peer):checked~*):where([data-theme=dark], [data-theme=dark] *) {
border-color: var(--color-purple-200)
}

.peer-checked\:dark\:bg-purple-200:is(:where(.peer):checked~*):where([data-theme=dark], [data-theme=dark] *) {
background-color: var(--color-purple-200)
}

.peer-checked\:dark\:bg-purple-800:is(:where(.peer):checked~*):where([data-theme=dark], [data-theme=dark] *) {
background-color: var(--color-purple-800)
}

@media (hover:hover) {
.peer-hover\:dark\:ring-gray-400\/10:is(:where(.peer):hover~*):where([data-theme=dark], [data-theme=dark] *) {
  --tw-ring-color: #99a1af1a
}

@supports (color:color-mix(in lab, red, red)) {
  .peer-hover\:dark\:ring-gray-400\/10:is(:where(.peer):hover~*):where([data-theme=dark], [data-theme=dark] *) {
    --tw-ring-color: color-mix(in oklab, var(--color-gray-400) 10%, transparent)
  }
}

.peer-checked\:peer-hover\:dark\:ring-purple-200\/10:is(:where(.peer):checked~*):is(:where(.peer):hover~*):where([data-theme=dark], [data-theme=dark] *) {
  --tw-ring-color: #e9d5ff1a
}

@supports (color:color-mix(in lab, red, red)) {
  .peer-checked\:peer-hover\:dark\:ring-purple-200\/10:is(:where(.peer):checked~*):is(:where(.peer):hover~*):where([data-theme=dark], [data-theme=dark] *) {
    --tw-ring-color: color-mix(in oklab, var(--color-purple-200) 10%, transparent)
  }
}
}

.peer-focus-visible\:dark\:outline-gray-400:is(:where(.peer):focus-visible~*):where([data-theme=dark], [data-theme=dark] *) {
outline-color: var(--color-gray-400)
}

.\[\&_svg\]\:pointer-events-none svg {
pointer-events: none
}

.\[\&_svg\]\:shrink-0 svg {
flex-shrink: 0
}

.\[\&\>td\]\:whitespace-nowrap>td {
white-space: nowrap
}

.\[\&\>th\]\:p-1>th {
padding: calc(var(--spacing)*1)
}

.\[\&\>th\]\:text-start>th {
text-align: start
}

.\[\&\>tr\]\:border-t>tr {
border-top-style: var(--tw-border-style);
border-top-width: 1px
}

.\[\&\>tr\]\:border-color-surface-high>tr {
border-color: var(--surface-high, oklch(92.8%.006 264.531))
}

@supports (color:color-mix(in lab, red, red)) {
.\[\&\>tr\]\:border-color-surface-high>tr {
  border-color: color-mix(in oklab, var(--surface-high, var(--color-gray-200)) var(--alpha-border, 100%), transparent)
}
}

.\[\&\>tr\>td\]\:p-1>tr>td {
padding: calc(var(--spacing)*1)
}

.\[\&\>tr\>td\:nth-child\(3\)\]\:text-center>tr>td:nth-child(3) {
text-align: center
}
}

:root {
--error: var(--color-red-700);
--on-error: var(--color-white)
}

:root:where([data-theme=dark]) {
--error: var(--color-red-300);
--on-error: var(--color-red-950)
}

:host {
--hem: 16px
}

html {
color-scheme: light
}

@media (prefers-color-scheme:dark) {
html {
color-scheme: dark
}
}

body {
font-optical-sizing: auto;
background-color: var(--surface-container, oklch(96.7%.003 264.542));
font-family: Inter Variable, sans-serif;
font-size: 1rem
}

@supports (color:color-mix(in lab, red, red)) {
body {
background-color: color-mix(in oklab, var(--surface-container, var(--color-gray-100)) var(--alpha-bg, 100%), transparent)
}
}

body {
font-size: var(--text-base);
line-height: var(--tw-leading, var(--text-base--line-height));
color: var(--on-surface, oklch(21%.034 264.665))
}

@supports (color:color-mix(in lab, red, red)) {
body {
color: color-mix(in oklab, var(--on-surface, var(--color-gray-900)) var(--alpha-text, 100%), transparent)
}
}

[data-accent=amber] {
--primary: var(--color-amber-800);
--on-primary: var(--color-white)
}

[data-accent=amber]:where([data-theme=dark]) {
--primary: var(--color-amber-200);
--on-primary: var(--color-amber-900)
}

[data-accent=green] {
--primary: var(--color-green-800);
--on-primary: var(--color-white)
}

[data-accent=green]:where([data-theme=dark]) {
--primary: var(--color-green-200);
--on-primary: var(--color-green-900)
}

[data-accent=blue] {
--primary: var(--color-blue-800);
--on-primary: var(--color-white)
}

[data-accent=blue]:where([data-theme=dark]) {
--primary: var(--color-blue-200);
--on-primary: var(--color-blue-900)
}

[data-accent=purple] {
--primary: var(--color-purple-800);
--on-primary: var(--color-white)
}

[data-accent=purple]:where([data-theme=dark]) {
--primary: var(--color-purple-200);
--on-primary: var(--color-purple-900)
}

[data-accent=pink] {
--primary: var(--color-pink-800);
--on-primary: var(--color-white)
}

[data-accent=pink]:where([data-theme=dark]) {
--primary: var(--color-pink-200);
--on-primary: var(--color-pink-900)
}

[data-accent=neutral] {
--primary: var(--color-neutral-800);
--on-primary: var(--color-white)
}

[data-accent=neutral]:where([data-theme=dark]) {
--primary: var(--color-neutral-200);
--on-primary: var(--color-neutral-900)
}

[data-variant=slate] {
--surface: var(--color-white);
--surface-container: var(--color-slate-100);
--surface-high: var(--color-slate-200);
--surface-highest: var(--color-slate-300);
--on-surface: var(--color-slate-900);
--on-surface-variant: var(--color-slate-600);
--outline: var(--color-slate-500);
--outline-variant: var(--color-slate-400)
}

[data-variant=slate]:where([data-theme=dark]) {
--surface: var(--color-slate-950);
--surface-container: var(--color-slate-900);
--surface-high: var(--color-slate-800);
--surface-highest: var(--color-slate-700);
--on-surface: var(--color-slate-100);
--on-surface-variant: var(--color-slate-400);
--outline: var(--color-slate-500);
--outline-variant: var(--color-slate-600)
}

[data-variant=gray] {
--surface: var(--color-white);
--surface-container: var(--color-gray-100);
--surface-high: var(--color-gray-200);
--surface-highest: var(--color-gray-300);
--on-surface: var(--color-gray-900);
--on-surface-variant: var(--color-gray-600);
--outline: var(--color-gray-500);
--outline-variant: var(--color-gray-400)
}

[data-variant=gray]:where([data-theme=dark]) {
--surface: var(--color-gray-950);
--surface-container: var(--color-gray-900);
--surface-high: var(--color-gray-800);
--surface-highest: var(--color-gray-700);
--on-surface: var(--color-gray-100);
--on-surface-variant: var(--color-gray-400);
--outline: var(--color-gray-500);
--outline-variant: var(--color-gray-600)
}

[data-variant=zinc] {
--surface: var(--color-white);
--surface-container: var(--color-zinc-100);
--surface-high: var(--color-zinc-200);
--surface-highest: var(--color-zinc-300);
--on-surface: var(--color-zinc-900);
--on-surface-variant: var(--color-zinc-600);
--outline: var(--color-zinc-500);
--outline-variant: var(--color-zinc-400)
}

[data-variant=zinc]:where([data-theme=dark]) {
--surface: var(--color-zinc-950);
--surface-container: var(--color-zinc-900);
--surface-high: var(--color-zinc-800);
--surface-highest: var(--color-zinc-700);
--on-surface: var(--color-zinc-100);
--on-surface-variant: var(--color-zinc-400);
--outline: var(--color-zinc-500);
--outline-variant: var(--color-zinc-600)
}

[data-variant=neutral] {
--surface: var(--color-white);
--surface-container: var(--color-neutral-100);
--surface-high: var(--color-neutral-200);
--surface-highest: var(--color-neutral-300);
--on-surface: var(--color-neutral-900);
--on-surface-variant: var(--color-neutral-600);
--outline: var(--color-neutral-500);
--outline-variant: var(--color-neutral-400)
}

[data-variant=neutral]:where([data-theme=dark]) {
--surface: var(--color-neutral-950);
--surface-container: var(--color-neutral-900);
--surface-high: var(--color-neutral-800);
--surface-highest: var(--color-neutral-700);
--on-surface: var(--color-neutral-100);
--on-surface-variant: var(--color-neutral-400);
--outline: var(--color-neutral-500);
--outline-variant: var(--color-neutral-600)
}

[data-variant=stone] {
--surface: var(--color-white);
--surface-container: var(--color-stone-100);
--surface-high: var(--color-stone-200);
--surface-highest: var(--color-stone-300);
--on-surface: var(--color-stone-900);
--on-surface-variant: var(--color-stone-600);
--outline: var(--color-stone-500);
--outline-variant: var(--color-stone-400)
}

[data-variant=stone]:where([data-theme=dark]) {
--surface: var(--color-stone-950);
--surface-container: var(--color-stone-900);
--surface-high: var(--color-stone-800);
--surface-highest: var(--color-stone-700);
--on-surface: var(--color-stone-100);
--on-surface-variant: var(--color-stone-400);
--outline: var(--color-stone-500);
--outline-variant: var(--color-stone-600)
}

@keyframes spin {
to {
transform: rotate(360deg)
}
}

@keyframes circle-grow {
0% {
transform: scale(0)
}

to {
transform: scale(1)
}
}