@import url("https://fonts.googleapis.com/css2?family=Amatic+SC:wght@400;700&display=swap");
@layer lib, layout, theme, theme-utils, utils;
/*
  1. Use a more-intuitive box-sizing model.
*/
@layer lib {
  *,
*::before,
*::after {
    box-sizing: border-box;
  }
  /*
    2. Remove default margin
  */
  * {
    margin: 0;
    padding: 0;
  }
  /*
    3. Allow percentage-based heights in the application
  */
  html,
body {
    height: 100%;
    font-family: var(--font);
  }
  /*
    Typographic tweaks!
    4. Add accessible line-height
    5. Improve text rendering
  */
  body {
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
  }
  /*
    6. Improve media defaults
  */
  img,
picture,
video,
canvas,
svg {
    display: block;
    max-width: 100%;
  }
  /*
    7. Remove built-in form typography styles
  */
  input,
button,
textarea,
select {
    font: inherit;
  }
  /*
    8. Avoid text overflows
  */
  p,
h1,
h2,
h3,
h4,
h5,
h6 {
    overflow-wrap: break-word;
  }
  /*
    9. Create a root stacking context
  */
  #root,
#__next {
    isolation: isolate;
  }
}
@layer layout {
  .content, .navbar {
    max-width: var(--content-width);
    margin: auto;
    padding: var(--sp-5) var(--sp-6);
  }
  @media (min-width: 768px) {
    .content, .navbar {
      padding: var(--sp-5) var(--sp-8);
    }
  }
  .hidden {
    display: none;
  }
  .d-flex, .align-self-stretch, .align-self-baseline, .align-self-center, .align-self-end, .align-self-start, .align-self-auto, .align-content-stretch, .align-content-around, .align-content-between, .align-content-center, .align-content-end, .align-content-start, .align-items-stretch, .align-items-baseline, .align-items-center, .align-items-end, .align-items-start, .justify-content-around, .justify-content-between, .justify-content-center, .justify-content-end, .justify-content-start, .flex-wrap-reverse, .flex-nowrap, .flex-wrap, .flex-column-reverse, .flex-row-reverse, .flex-column, .flex-row {
    display: flex !important;
  }
  .d-block {
    display: block !important;
  }
  .d-inline {
    display: inline !important;
  }
  .d-inline-block {
    display: inline-block !important;
  }
  .d-inline-flex {
    display: inline-flex !important;
  }
  .d-none {
    display: none !important;
  }
  .flex-row {
    flex-direction: row !important;
  }
  .flex-column {
    flex-direction: column !important;
  }
  .flex-row-reverse {
    flex-direction: row-reverse !important;
  }
  .flex-column-reverse {
    flex-direction: column-reverse !important;
  }
  .flex-wrap {
    flex-wrap: wrap !important;
  }
  .flex-nowrap {
    flex-wrap: nowrap !important;
  }
  .flex-wrap-reverse {
    flex-wrap: wrap-reverse !important;
  }
  .justify-content-start {
    justify-content: flex-start !important;
  }
  .justify-content-end {
    justify-content: flex-end !important;
  }
  .justify-content-center {
    justify-content: center !important;
  }
  .justify-content-between {
    justify-content: space-between !important;
  }
  .justify-content-around {
    justify-content: space-around !important;
  }
  .align-items-start {
    align-items: flex-start !important;
  }
  .align-items-end {
    align-items: flex-end !important;
  }
  .align-items-center {
    align-items: center !important;
  }
  .align-items-baseline {
    align-items: baseline !important;
  }
  .align-items-stretch {
    align-items: stretch !important;
  }
  .align-content-start {
    align-content: flex-start !important;
  }
  .align-content-end {
    align-content: flex-end !important;
  }
  .align-content-center {
    align-content: center !important;
  }
  .align-content-between {
    align-content: space-between !important;
  }
  .align-content-around {
    align-content: space-around !important;
  }
  .align-content-stretch {
    align-content: stretch !important;
  }
  .align-self-auto {
    align-self: auto !important;
  }
  .align-self-start {
    align-self: flex-start !important;
  }
  .align-self-end {
    align-self: flex-end !important;
  }
  .align-self-center {
    align-self: center !important;
  }
  .align-self-baseline {
    align-self: baseline !important;
  }
  .align-self-stretch {
    align-self: stretch !important;
  }
}
.text-left {
  text-align: left !important;
}

.text-center {
  text-align: center !important;
}

.text-right {
  text-align: right !important;
}

.text-xs {
  font-size: var(--fs-xs) !important;
  line-height: var(--flh-xs) !important;
}

.text-sm {
  font-size: var(--fs-sm) !important;
  line-height: var(--flh-sm) !important;
}

.text-md {
  font-size: var(--fs-md) !important;
  line-height: var(--flh-md) !important;
}

.text-lg {
  font-size: var(--fs-lg) !important;
  line-height: var(--flh-lg) !important;
}

.text-xl {
  font-size: var(--fs-xl) !important;
  line-height: var(--flh-xl) !important;
}

.text-2xl {
  font-size: var(--fs-2xl) !important;
  line-height: var(--flh-2xl) !important;
}

.text-3xl {
  font-size: var(--fs-3xl) !important;
  line-height: var(--flh-3xl) !important;
}

.text-4xl {
  font-size: var(--fs-4xl) !important;
  line-height: var(--flh-4xl) !important;
}

.text-5xl {
  font-size: var(--fs-5xl) !important;
  line-height: var(--flh-5xl) !important;
}

.text-6xl {
  font-size: var(--fs-6xl) !important;
  line-height: var(--flh-6xl) !important;
}

.text-7xl {
  font-size: var(--fs-7xl) !important;
  line-height: var(--flh-7xl) !important;
}

.text-8xl {
  font-size: var(--fs-8xl) !important;
  line-height: var(--flh-8xl) !important;
}

.text-9xl {
  font-size: var(--fs-9xl) !important;
  line-height: var(--flh-9xl) !important;
}

@layer lib {
  a {
    color: inherit;
    text-decoration: none;
  }
  h1, h2, h3, h4, h5, h6 {
    line-height: var(--flh-md);
    color: var(--primary);
    font-family: var(--font-title);
  }
  h1 {
    font-size: var(--fs-5xl);
  }
  h2 {
    font-size: var(--fs-4xl);
  }
  h3 {
    font-size: var(--fs-xl);
  }
  h4 {
    font-size: var(--fs-lg);
  }
  h5 {
    font-size: var(--fs-md);
  }
  h6 {
    font-size: var(--fs-md);
  }
}
.bg-white {
  background-color: var(--white) !important;
}

.border-white {
  border: 1px solid var(--white) !important;
}

.text-white {
  color: var(--white) !important;
}

.bg-black {
  background-color: var(--black) !important;
}

.border-black {
  border: 1px solid var(--black) !important;
}

.text-black {
  color: var(--black) !important;
}

.bg-primary {
  background-color: var(--primary) !important;
}

.border-primary {
  border: 1px solid var(--primary) !important;
}

.text-primary {
  color: var(--primary) !important;
}

.bg-primary-0 {
  background-color: var(--primary-0) !important;
}

.border-primary-0 {
  border: 1px solid var(--primary-0) !important;
}

.text-primary-0 {
  color: var(--primary-0) !important;
}

.bg-primary-1 {
  background-color: var(--primary-1) !important;
}

.border-primary-1 {
  border: 1px solid var(--primary-1) !important;
}

.text-primary-1 {
  color: var(--primary-1) !important;
}

.bg-primary-2 {
  background-color: var(--primary-2) !important;
}

.border-primary-2 {
  border: 1px solid var(--primary-2) !important;
}

.text-primary-2 {
  color: var(--primary-2) !important;
}

.bg-primary-3 {
  background-color: var(--primary-3) !important;
}

.border-primary-3 {
  border: 1px solid var(--primary-3) !important;
}

.text-primary-3 {
  color: var(--primary-3) !important;
}

.bg-primary-4 {
  background-color: var(--primary-4) !important;
}

.border-primary-4 {
  border: 1px solid var(--primary-4) !important;
}

.text-primary-4 {
  color: var(--primary-4) !important;
}

.bg-primary-5 {
  background-color: var(--primary-5) !important;
}

.border-primary-5 {
  border: 1px solid var(--primary-5) !important;
}

.text-primary-5 {
  color: var(--primary-5) !important;
}

.bg-primary-6 {
  background-color: var(--primary-6) !important;
}

.border-primary-6 {
  border: 1px solid var(--primary-6) !important;
}

.text-primary-6 {
  color: var(--primary-6) !important;
}

.bg-primary-7 {
  background-color: var(--primary-7) !important;
}

.border-primary-7 {
  border: 1px solid var(--primary-7) !important;
}

.text-primary-7 {
  color: var(--primary-7) !important;
}

.bg-primary-8 {
  background-color: var(--primary-8) !important;
}

.border-primary-8 {
  border: 1px solid var(--primary-8) !important;
}

.text-primary-8 {
  color: var(--primary-8) !important;
}

.bg-primary-9 {
  background-color: var(--primary-9) !important;
}

.border-primary-9 {
  border: 1px solid var(--primary-9) !important;
}

.text-primary-9 {
  color: var(--primary-9) !important;
}

.bg-primary-10 {
  background-color: var(--primary-10) !important;
}

.border-primary-10 {
  border: 1px solid var(--primary-10) !important;
}

.text-primary-10 {
  color: var(--primary-10) !important;
}

.bg-secondary {
  background-color: var(--secondary) !important;
}

.border-secondary {
  border: 1px solid var(--secondary) !important;
}

.text-secondary {
  color: var(--secondary) !important;
}

.bg-secondary-0 {
  background-color: var(--secondary-0) !important;
}

.border-secondary-0 {
  border: 1px solid var(--secondary-0) !important;
}

.text-secondary-0 {
  color: var(--secondary-0) !important;
}

.bg-secondary-1 {
  background-color: var(--secondary-1) !important;
}

.border-secondary-1 {
  border: 1px solid var(--secondary-1) !important;
}

.text-secondary-1 {
  color: var(--secondary-1) !important;
}

.bg-secondary-2 {
  background-color: var(--secondary-2) !important;
}

.border-secondary-2 {
  border: 1px solid var(--secondary-2) !important;
}

.text-secondary-2 {
  color: var(--secondary-2) !important;
}

.bg-secondary-3 {
  background-color: var(--secondary-3) !important;
}

.border-secondary-3 {
  border: 1px solid var(--secondary-3) !important;
}

.text-secondary-3 {
  color: var(--secondary-3) !important;
}

.bg-secondary-4 {
  background-color: var(--secondary-4) !important;
}

.border-secondary-4 {
  border: 1px solid var(--secondary-4) !important;
}

.text-secondary-4 {
  color: var(--secondary-4) !important;
}

.bg-secondary-5 {
  background-color: var(--secondary-5) !important;
}

.border-secondary-5 {
  border: 1px solid var(--secondary-5) !important;
}

.text-secondary-5 {
  color: var(--secondary-5) !important;
}

.bg-secondary-6 {
  background-color: var(--secondary-6) !important;
}

.border-secondary-6 {
  border: 1px solid var(--secondary-6) !important;
}

.text-secondary-6 {
  color: var(--secondary-6) !important;
}

.bg-secondary-7 {
  background-color: var(--secondary-7) !important;
}

.border-secondary-7 {
  border: 1px solid var(--secondary-7) !important;
}

.text-secondary-7 {
  color: var(--secondary-7) !important;
}

.bg-secondary-8 {
  background-color: var(--secondary-8) !important;
}

.border-secondary-8 {
  border: 1px solid var(--secondary-8) !important;
}

.text-secondary-8 {
  color: var(--secondary-8) !important;
}

.bg-secondary-9 {
  background-color: var(--secondary-9) !important;
}

.border-secondary-9 {
  border: 1px solid var(--secondary-9) !important;
}

.text-secondary-9 {
  color: var(--secondary-9) !important;
}

.bg-secondary-10 {
  background-color: var(--secondary-10) !important;
}

.border-secondary-10 {
  border: 1px solid var(--secondary-10) !important;
}

.text-secondary-10 {
  color: var(--secondary-10) !important;
}

.bg-gray {
  background-color: var(--gray) !important;
}

.border-gray {
  border: 1px solid var(--gray) !important;
}

.text-gray {
  color: var(--gray) !important;
}

.bg-gray-0 {
  background-color: var(--gray-0) !important;
}

.border-gray-0 {
  border: 1px solid var(--gray-0) !important;
}

.text-gray-0 {
  color: var(--gray-0) !important;
}

.bg-gray-1 {
  background-color: var(--gray-1) !important;
}

.border-gray-1 {
  border: 1px solid var(--gray-1) !important;
}

.text-gray-1 {
  color: var(--gray-1) !important;
}

.bg-gray-2 {
  background-color: var(--gray-2) !important;
}

.border-gray-2 {
  border: 1px solid var(--gray-2) !important;
}

.text-gray-2 {
  color: var(--gray-2) !important;
}

.bg-gray-3 {
  background-color: var(--gray-3) !important;
}

.border-gray-3 {
  border: 1px solid var(--gray-3) !important;
}

.text-gray-3 {
  color: var(--gray-3) !important;
}

.bg-gray-4 {
  background-color: var(--gray-4) !important;
}

.border-gray-4 {
  border: 1px solid var(--gray-4) !important;
}

.text-gray-4 {
  color: var(--gray-4) !important;
}

.bg-gray-5 {
  background-color: var(--gray-5) !important;
}

.border-gray-5 {
  border: 1px solid var(--gray-5) !important;
}

.text-gray-5 {
  color: var(--gray-5) !important;
}

.bg-gray-6 {
  background-color: var(--gray-6) !important;
}

.border-gray-6 {
  border: 1px solid var(--gray-6) !important;
}

.text-gray-6 {
  color: var(--gray-6) !important;
}

.bg-gray-7 {
  background-color: var(--gray-7) !important;
}

.border-gray-7 {
  border: 1px solid var(--gray-7) !important;
}

.text-gray-7 {
  color: var(--gray-7) !important;
}

.bg-gray-8 {
  background-color: var(--gray-8) !important;
}

.border-gray-8 {
  border: 1px solid var(--gray-8) !important;
}

.text-gray-8 {
  color: var(--gray-8) !important;
}

.bg-gray-9 {
  background-color: var(--gray-9) !important;
}

.border-gray-9 {
  border: 1px solid var(--gray-9) !important;
}

.text-gray-9 {
  color: var(--gray-9) !important;
}

.bg-gray-10 {
  background-color: var(--gray-10) !important;
}

.border-gray-10 {
  border: 1px solid var(--gray-10) !important;
}

.text-gray-10 {
  color: var(--gray-10) !important;
}

.bg-success {
  background-color: var(--success) !important;
}

.border-success {
  border: 1px solid var(--success) !important;
}

.text-success {
  color: var(--success) !important;
}

.bg-success-0 {
  background-color: var(--success-0) !important;
}

.border-success-0 {
  border: 1px solid var(--success-0) !important;
}

.text-success-0 {
  color: var(--success-0) !important;
}

.bg-success-1 {
  background-color: var(--success-1) !important;
}

.border-success-1 {
  border: 1px solid var(--success-1) !important;
}

.text-success-1 {
  color: var(--success-1) !important;
}

.bg-success-2 {
  background-color: var(--success-2) !important;
}

.border-success-2 {
  border: 1px solid var(--success-2) !important;
}

.text-success-2 {
  color: var(--success-2) !important;
}

.bg-success-3 {
  background-color: var(--success-3) !important;
}

.border-success-3 {
  border: 1px solid var(--success-3) !important;
}

.text-success-3 {
  color: var(--success-3) !important;
}

.bg-success-4 {
  background-color: var(--success-4) !important;
}

.border-success-4 {
  border: 1px solid var(--success-4) !important;
}

.text-success-4 {
  color: var(--success-4) !important;
}

.bg-success-5 {
  background-color: var(--success-5) !important;
}

.border-success-5 {
  border: 1px solid var(--success-5) !important;
}

.text-success-5 {
  color: var(--success-5) !important;
}

.bg-success-6 {
  background-color: var(--success-6) !important;
}

.border-success-6 {
  border: 1px solid var(--success-6) !important;
}

.text-success-6 {
  color: var(--success-6) !important;
}

.bg-success-7 {
  background-color: var(--success-7) !important;
}

.border-success-7 {
  border: 1px solid var(--success-7) !important;
}

.text-success-7 {
  color: var(--success-7) !important;
}

.bg-success-8 {
  background-color: var(--success-8) !important;
}

.border-success-8 {
  border: 1px solid var(--success-8) !important;
}

.text-success-8 {
  color: var(--success-8) !important;
}

.bg-success-9 {
  background-color: var(--success-9) !important;
}

.border-success-9 {
  border: 1px solid var(--success-9) !important;
}

.text-success-9 {
  color: var(--success-9) !important;
}

.bg-success-10 {
  background-color: var(--success-10) !important;
}

.border-success-10 {
  border: 1px solid var(--success-10) !important;
}

.text-success-10 {
  color: var(--success-10) !important;
}

.bg-warning {
  background-color: var(--warning) !important;
}

.border-warning {
  border: 1px solid var(--warning) !important;
}

.text-warning {
  color: var(--warning) !important;
}

.bg-warning-0 {
  background-color: var(--warning-0) !important;
}

.border-warning-0 {
  border: 1px solid var(--warning-0) !important;
}

.text-warning-0 {
  color: var(--warning-0) !important;
}

.bg-warning-1 {
  background-color: var(--warning-1) !important;
}

.border-warning-1 {
  border: 1px solid var(--warning-1) !important;
}

.text-warning-1 {
  color: var(--warning-1) !important;
}

.bg-warning-2 {
  background-color: var(--warning-2) !important;
}

.border-warning-2 {
  border: 1px solid var(--warning-2) !important;
}

.text-warning-2 {
  color: var(--warning-2) !important;
}

.bg-warning-3 {
  background-color: var(--warning-3) !important;
}

.border-warning-3 {
  border: 1px solid var(--warning-3) !important;
}

.text-warning-3 {
  color: var(--warning-3) !important;
}

.bg-warning-4 {
  background-color: var(--warning-4) !important;
}

.border-warning-4 {
  border: 1px solid var(--warning-4) !important;
}

.text-warning-4 {
  color: var(--warning-4) !important;
}

.bg-warning-5 {
  background-color: var(--warning-5) !important;
}

.border-warning-5 {
  border: 1px solid var(--warning-5) !important;
}

.text-warning-5 {
  color: var(--warning-5) !important;
}

.bg-warning-6 {
  background-color: var(--warning-6) !important;
}

.border-warning-6 {
  border: 1px solid var(--warning-6) !important;
}

.text-warning-6 {
  color: var(--warning-6) !important;
}

.bg-warning-7 {
  background-color: var(--warning-7) !important;
}

.border-warning-7 {
  border: 1px solid var(--warning-7) !important;
}

.text-warning-7 {
  color: var(--warning-7) !important;
}

.bg-warning-8 {
  background-color: var(--warning-8) !important;
}

.border-warning-8 {
  border: 1px solid var(--warning-8) !important;
}

.text-warning-8 {
  color: var(--warning-8) !important;
}

.bg-warning-9 {
  background-color: var(--warning-9) !important;
}

.border-warning-9 {
  border: 1px solid var(--warning-9) !important;
}

.text-warning-9 {
  color: var(--warning-9) !important;
}

.bg-warning-10 {
  background-color: var(--warning-10) !important;
}

.border-warning-10 {
  border: 1px solid var(--warning-10) !important;
}

.text-warning-10 {
  color: var(--warning-10) !important;
}

.bg-danger {
  background-color: var(--danger) !important;
}

.border-danger {
  border: 1px solid var(--danger) !important;
}

.text-danger {
  color: var(--danger) !important;
}

.bg-danger-0 {
  background-color: var(--danger-0) !important;
}

.border-danger-0 {
  border: 1px solid var(--danger-0) !important;
}

.text-danger-0 {
  color: var(--danger-0) !important;
}

.bg-danger-1 {
  background-color: var(--danger-1) !important;
}

.border-danger-1 {
  border: 1px solid var(--danger-1) !important;
}

.text-danger-1 {
  color: var(--danger-1) !important;
}

.bg-danger-2 {
  background-color: var(--danger-2) !important;
}

.border-danger-2 {
  border: 1px solid var(--danger-2) !important;
}

.text-danger-2 {
  color: var(--danger-2) !important;
}

.bg-danger-3 {
  background-color: var(--danger-3) !important;
}

.border-danger-3 {
  border: 1px solid var(--danger-3) !important;
}

.text-danger-3 {
  color: var(--danger-3) !important;
}

.bg-danger-4 {
  background-color: var(--danger-4) !important;
}

.border-danger-4 {
  border: 1px solid var(--danger-4) !important;
}

.text-danger-4 {
  color: var(--danger-4) !important;
}

.bg-danger-5 {
  background-color: var(--danger-5) !important;
}

.border-danger-5 {
  border: 1px solid var(--danger-5) !important;
}

.text-danger-5 {
  color: var(--danger-5) !important;
}

.bg-danger-6 {
  background-color: var(--danger-6) !important;
}

.border-danger-6 {
  border: 1px solid var(--danger-6) !important;
}

.text-danger-6 {
  color: var(--danger-6) !important;
}

.bg-danger-7 {
  background-color: var(--danger-7) !important;
}

.border-danger-7 {
  border: 1px solid var(--danger-7) !important;
}

.text-danger-7 {
  color: var(--danger-7) !important;
}

.bg-danger-8 {
  background-color: var(--danger-8) !important;
}

.border-danger-8 {
  border: 1px solid var(--danger-8) !important;
}

.text-danger-8 {
  color: var(--danger-8) !important;
}

.bg-danger-9 {
  background-color: var(--danger-9) !important;
}

.border-danger-9 {
  border: 1px solid var(--danger-9) !important;
}

.text-danger-9 {
  color: var(--danger-9) !important;
}

.bg-danger-10 {
  background-color: var(--danger-10) !important;
}

.border-danger-10 {
  border: 1px solid var(--danger-10) !important;
}

.text-danger-10 {
  color: var(--danger-10) !important;
}

.m-auto {
  margin: auto !important;
}

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

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

.mt-auto {
  margin-top: auto !important;
}

.mr-auto {
  margin-right: auto !important;
}

.mb-auto {
  margin-bottom: auto !important;
}

.ml-auto {
  margin-left: auto !important;
}

.m-0 {
  margin: var(--sp-0) !important;
}

.mx-0 {
  margin-left: var(--sp-0) !important;
  margin-right: var(--sp-0) !important;
}

.my-0 {
  margin-top: var(--sp-0) !important;
  margin-bottom: var(--sp-0) !important;
}

.mt-0 {
  margin-top: var(--sp-0) !important;
}

.mr-0 {
  margin-right: var(--sp-0) !important;
}

.mb-0 {
  margin-bottom: var(--sp-0) !important;
}

.ml-0 {
  margin-left: var(--sp-0) !important;
}

.m-1 {
  margin: var(--sp-1) !important;
}

.mx-1 {
  margin-left: var(--sp-1) !important;
  margin-right: var(--sp-1) !important;
}

.my-1 {
  margin-top: var(--sp-1) !important;
  margin-bottom: var(--sp-1) !important;
}

.mt-1 {
  margin-top: var(--sp-1) !important;
}

.mr-1 {
  margin-right: var(--sp-1) !important;
}

.mb-1 {
  margin-bottom: var(--sp-1) !important;
}

.ml-1 {
  margin-left: var(--sp-1) !important;
}

.m-2 {
  margin: var(--sp-2) !important;
}

.mx-2 {
  margin-left: var(--sp-2) !important;
  margin-right: var(--sp-2) !important;
}

.my-2 {
  margin-top: var(--sp-2) !important;
  margin-bottom: var(--sp-2) !important;
}

.mt-2 {
  margin-top: var(--sp-2) !important;
}

.mr-2 {
  margin-right: var(--sp-2) !important;
}

.mb-2 {
  margin-bottom: var(--sp-2) !important;
}

.ml-2 {
  margin-left: var(--sp-2) !important;
}

.m-3 {
  margin: var(--sp-3) !important;
}

.mx-3 {
  margin-left: var(--sp-3) !important;
  margin-right: var(--sp-3) !important;
}

.my-3 {
  margin-top: var(--sp-3) !important;
  margin-bottom: var(--sp-3) !important;
}

.mt-3 {
  margin-top: var(--sp-3) !important;
}

.mr-3 {
  margin-right: var(--sp-3) !important;
}

.mb-3 {
  margin-bottom: var(--sp-3) !important;
}

.ml-3 {
  margin-left: var(--sp-3) !important;
}

.m-4 {
  margin: var(--sp-4) !important;
}

.mx-4 {
  margin-left: var(--sp-4) !important;
  margin-right: var(--sp-4) !important;
}

.my-4 {
  margin-top: var(--sp-4) !important;
  margin-bottom: var(--sp-4) !important;
}

.mt-4 {
  margin-top: var(--sp-4) !important;
}

.mr-4 {
  margin-right: var(--sp-4) !important;
}

.mb-4 {
  margin-bottom: var(--sp-4) !important;
}

.ml-4 {
  margin-left: var(--sp-4) !important;
}

.m-5 {
  margin: var(--sp-5) !important;
}

.mx-5 {
  margin-left: var(--sp-5) !important;
  margin-right: var(--sp-5) !important;
}

.my-5 {
  margin-top: var(--sp-5) !important;
  margin-bottom: var(--sp-5) !important;
}

.mt-5 {
  margin-top: var(--sp-5) !important;
}

.mr-5 {
  margin-right: var(--sp-5) !important;
}

.mb-5 {
  margin-bottom: var(--sp-5) !important;
}

.ml-5 {
  margin-left: var(--sp-5) !important;
}

.m-6 {
  margin: var(--sp-6) !important;
}

.mx-6 {
  margin-left: var(--sp-6) !important;
  margin-right: var(--sp-6) !important;
}

.my-6 {
  margin-top: var(--sp-6) !important;
  margin-bottom: var(--sp-6) !important;
}

.mt-6 {
  margin-top: var(--sp-6) !important;
}

.mr-6 {
  margin-right: var(--sp-6) !important;
}

.mb-6 {
  margin-bottom: var(--sp-6) !important;
}

.ml-6 {
  margin-left: var(--sp-6) !important;
}

.m-7 {
  margin: var(--sp-7) !important;
}

.mx-7 {
  margin-left: var(--sp-7) !important;
  margin-right: var(--sp-7) !important;
}

.my-7 {
  margin-top: var(--sp-7) !important;
  margin-bottom: var(--sp-7) !important;
}

.mt-7 {
  margin-top: var(--sp-7) !important;
}

.mr-7 {
  margin-right: var(--sp-7) !important;
}

.mb-7 {
  margin-bottom: var(--sp-7) !important;
}

.ml-7 {
  margin-left: var(--sp-7) !important;
}

.m-8 {
  margin: var(--sp-8) !important;
}

.mx-8 {
  margin-left: var(--sp-8) !important;
  margin-right: var(--sp-8) !important;
}

.my-8 {
  margin-top: var(--sp-8) !important;
  margin-bottom: var(--sp-8) !important;
}

.mt-8 {
  margin-top: var(--sp-8) !important;
}

.mr-8 {
  margin-right: var(--sp-8) !important;
}

.mb-8 {
  margin-bottom: var(--sp-8) !important;
}

.ml-8 {
  margin-left: var(--sp-8) !important;
}

.m-9 {
  margin: var(--sp-9) !important;
}

.mx-9 {
  margin-left: var(--sp-9) !important;
  margin-right: var(--sp-9) !important;
}

.my-9 {
  margin-top: var(--sp-9) !important;
  margin-bottom: var(--sp-9) !important;
}

.mt-9 {
  margin-top: var(--sp-9) !important;
}

.mr-9 {
  margin-right: var(--sp-9) !important;
}

.mb-9 {
  margin-bottom: var(--sp-9) !important;
}

.ml-9 {
  margin-left: var(--sp-9) !important;
}

.m-10 {
  margin: var(--sp-10) !important;
}

.mx-10 {
  margin-left: var(--sp-10) !important;
  margin-right: var(--sp-10) !important;
}

.my-10 {
  margin-top: var(--sp-10) !important;
  margin-bottom: var(--sp-10) !important;
}

.mt-10 {
  margin-top: var(--sp-10) !important;
}

.mr-10 {
  margin-right: var(--sp-10) !important;
}

.mb-10 {
  margin-bottom: var(--sp-10) !important;
}

.ml-10 {
  margin-left: var(--sp-10) !important;
}

.m-11 {
  margin: var(--sp-11) !important;
}

.mx-11 {
  margin-left: var(--sp-11) !important;
  margin-right: var(--sp-11) !important;
}

.my-11 {
  margin-top: var(--sp-11) !important;
  margin-bottom: var(--sp-11) !important;
}

.mt-11 {
  margin-top: var(--sp-11) !important;
}

.mr-11 {
  margin-right: var(--sp-11) !important;
}

.mb-11 {
  margin-bottom: var(--sp-11) !important;
}

.ml-11 {
  margin-left: var(--sp-11) !important;
}

.m-12 {
  margin: var(--sp-12) !important;
}

.mx-12 {
  margin-left: var(--sp-12) !important;
  margin-right: var(--sp-12) !important;
}

.my-12 {
  margin-top: var(--sp-12) !important;
  margin-bottom: var(--sp-12) !important;
}

.mt-12 {
  margin-top: var(--sp-12) !important;
}

.mr-12 {
  margin-right: var(--sp-12) !important;
}

.mb-12 {
  margin-bottom: var(--sp-12) !important;
}

.ml-12 {
  margin-left: var(--sp-12) !important;
}

.m-13 {
  margin: var(--sp-13) !important;
}

.mx-13 {
  margin-left: var(--sp-13) !important;
  margin-right: var(--sp-13) !important;
}

.my-13 {
  margin-top: var(--sp-13) !important;
  margin-bottom: var(--sp-13) !important;
}

.mt-13 {
  margin-top: var(--sp-13) !important;
}

.mr-13 {
  margin-right: var(--sp-13) !important;
}

.mb-13 {
  margin-bottom: var(--sp-13) !important;
}

.ml-13 {
  margin-left: var(--sp-13) !important;
}

.m-14 {
  margin: var(--sp-14) !important;
}

.mx-14 {
  margin-left: var(--sp-14) !important;
  margin-right: var(--sp-14) !important;
}

.my-14 {
  margin-top: var(--sp-14) !important;
  margin-bottom: var(--sp-14) !important;
}

.mt-14 {
  margin-top: var(--sp-14) !important;
}

.mr-14 {
  margin-right: var(--sp-14) !important;
}

.mb-14 {
  margin-bottom: var(--sp-14) !important;
}

.ml-14 {
  margin-left: var(--sp-14) !important;
}

.m-15 {
  margin: var(--sp-15) !important;
}

.mx-15 {
  margin-left: var(--sp-15) !important;
  margin-right: var(--sp-15) !important;
}

.my-15 {
  margin-top: var(--sp-15) !important;
  margin-bottom: var(--sp-15) !important;
}

.mt-15 {
  margin-top: var(--sp-15) !important;
}

.mr-15 {
  margin-right: var(--sp-15) !important;
}

.mb-15 {
  margin-bottom: var(--sp-15) !important;
}

.ml-15 {
  margin-left: var(--sp-15) !important;
}

.p-0 {
  padding: var(--sp-0) !important;
}

.px-0 {
  padding-left: var(--sp-0) !important;
  padding-right: var(--sp-0) !important;
}

.py-0 {
  padding-top: var(--sp-0) !important;
  padding-bottom: var(--sp-0) !important;
}

.pt-0 {
  padding-top: var(--sp-0) !important;
}

.pr-0 {
  padding-right: var(--sp-0) !important;
}

.pb-0 {
  padding-bottom: var(--sp-0) !important;
}

.pl-0 {
  padding-left: var(--sp-0) !important;
}

.p-1 {
  padding: var(--sp-1) !important;
}

.px-1 {
  padding-left: var(--sp-1) !important;
  padding-right: var(--sp-1) !important;
}

.py-1 {
  padding-top: var(--sp-1) !important;
  padding-bottom: var(--sp-1) !important;
}

.pt-1 {
  padding-top: var(--sp-1) !important;
}

.pr-1 {
  padding-right: var(--sp-1) !important;
}

.pb-1 {
  padding-bottom: var(--sp-1) !important;
}

.pl-1 {
  padding-left: var(--sp-1) !important;
}

.p-2 {
  padding: var(--sp-2) !important;
}

.px-2 {
  padding-left: var(--sp-2) !important;
  padding-right: var(--sp-2) !important;
}

.py-2 {
  padding-top: var(--sp-2) !important;
  padding-bottom: var(--sp-2) !important;
}

.pt-2 {
  padding-top: var(--sp-2) !important;
}

.pr-2 {
  padding-right: var(--sp-2) !important;
}

.pb-2 {
  padding-bottom: var(--sp-2) !important;
}

.pl-2 {
  padding-left: var(--sp-2) !important;
}

.p-3 {
  padding: var(--sp-3) !important;
}

.px-3 {
  padding-left: var(--sp-3) !important;
  padding-right: var(--sp-3) !important;
}

.py-3 {
  padding-top: var(--sp-3) !important;
  padding-bottom: var(--sp-3) !important;
}

.pt-3 {
  padding-top: var(--sp-3) !important;
}

.pr-3 {
  padding-right: var(--sp-3) !important;
}

.pb-3 {
  padding-bottom: var(--sp-3) !important;
}

.pl-3 {
  padding-left: var(--sp-3) !important;
}

.p-4 {
  padding: var(--sp-4) !important;
}

.px-4 {
  padding-left: var(--sp-4) !important;
  padding-right: var(--sp-4) !important;
}

.py-4 {
  padding-top: var(--sp-4) !important;
  padding-bottom: var(--sp-4) !important;
}

.pt-4 {
  padding-top: var(--sp-4) !important;
}

.pr-4 {
  padding-right: var(--sp-4) !important;
}

.pb-4 {
  padding-bottom: var(--sp-4) !important;
}

.pl-4 {
  padding-left: var(--sp-4) !important;
}

.p-5 {
  padding: var(--sp-5) !important;
}

.px-5 {
  padding-left: var(--sp-5) !important;
  padding-right: var(--sp-5) !important;
}

.py-5 {
  padding-top: var(--sp-5) !important;
  padding-bottom: var(--sp-5) !important;
}

.pt-5 {
  padding-top: var(--sp-5) !important;
}

.pr-5 {
  padding-right: var(--sp-5) !important;
}

.pb-5 {
  padding-bottom: var(--sp-5) !important;
}

.pl-5 {
  padding-left: var(--sp-5) !important;
}

.p-6 {
  padding: var(--sp-6) !important;
}

.px-6 {
  padding-left: var(--sp-6) !important;
  padding-right: var(--sp-6) !important;
}

.py-6 {
  padding-top: var(--sp-6) !important;
  padding-bottom: var(--sp-6) !important;
}

.pt-6 {
  padding-top: var(--sp-6) !important;
}

.pr-6 {
  padding-right: var(--sp-6) !important;
}

.pb-6 {
  padding-bottom: var(--sp-6) !important;
}

.pl-6 {
  padding-left: var(--sp-6) !important;
}

.p-7 {
  padding: var(--sp-7) !important;
}

.px-7 {
  padding-left: var(--sp-7) !important;
  padding-right: var(--sp-7) !important;
}

.py-7 {
  padding-top: var(--sp-7) !important;
  padding-bottom: var(--sp-7) !important;
}

.pt-7 {
  padding-top: var(--sp-7) !important;
}

.pr-7 {
  padding-right: var(--sp-7) !important;
}

.pb-7 {
  padding-bottom: var(--sp-7) !important;
}

.pl-7 {
  padding-left: var(--sp-7) !important;
}

.p-8 {
  padding: var(--sp-8) !important;
}

.px-8 {
  padding-left: var(--sp-8) !important;
  padding-right: var(--sp-8) !important;
}

.py-8 {
  padding-top: var(--sp-8) !important;
  padding-bottom: var(--sp-8) !important;
}

.pt-8 {
  padding-top: var(--sp-8) !important;
}

.pr-8 {
  padding-right: var(--sp-8) !important;
}

.pb-8 {
  padding-bottom: var(--sp-8) !important;
}

.pl-8 {
  padding-left: var(--sp-8) !important;
}

.p-9 {
  padding: var(--sp-9) !important;
}

.px-9 {
  padding-left: var(--sp-9) !important;
  padding-right: var(--sp-9) !important;
}

.py-9 {
  padding-top: var(--sp-9) !important;
  padding-bottom: var(--sp-9) !important;
}

.pt-9 {
  padding-top: var(--sp-9) !important;
}

.pr-9 {
  padding-right: var(--sp-9) !important;
}

.pb-9 {
  padding-bottom: var(--sp-9) !important;
}

.pl-9 {
  padding-left: var(--sp-9) !important;
}

.p-10 {
  padding: var(--sp-10) !important;
}

.px-10 {
  padding-left: var(--sp-10) !important;
  padding-right: var(--sp-10) !important;
}

.py-10 {
  padding-top: var(--sp-10) !important;
  padding-bottom: var(--sp-10) !important;
}

.pt-10 {
  padding-top: var(--sp-10) !important;
}

.pr-10 {
  padding-right: var(--sp-10) !important;
}

.pb-10 {
  padding-bottom: var(--sp-10) !important;
}

.pl-10 {
  padding-left: var(--sp-10) !important;
}

.p-11 {
  padding: var(--sp-11) !important;
}

.px-11 {
  padding-left: var(--sp-11) !important;
  padding-right: var(--sp-11) !important;
}

.py-11 {
  padding-top: var(--sp-11) !important;
  padding-bottom: var(--sp-11) !important;
}

.pt-11 {
  padding-top: var(--sp-11) !important;
}

.pr-11 {
  padding-right: var(--sp-11) !important;
}

.pb-11 {
  padding-bottom: var(--sp-11) !important;
}

.pl-11 {
  padding-left: var(--sp-11) !important;
}

.p-12 {
  padding: var(--sp-12) !important;
}

.px-12 {
  padding-left: var(--sp-12) !important;
  padding-right: var(--sp-12) !important;
}

.py-12 {
  padding-top: var(--sp-12) !important;
  padding-bottom: var(--sp-12) !important;
}

.pt-12 {
  padding-top: var(--sp-12) !important;
}

.pr-12 {
  padding-right: var(--sp-12) !important;
}

.pb-12 {
  padding-bottom: var(--sp-12) !important;
}

.pl-12 {
  padding-left: var(--sp-12) !important;
}

.p-13 {
  padding: var(--sp-13) !important;
}

.px-13 {
  padding-left: var(--sp-13) !important;
  padding-right: var(--sp-13) !important;
}

.py-13 {
  padding-top: var(--sp-13) !important;
  padding-bottom: var(--sp-13) !important;
}

.pt-13 {
  padding-top: var(--sp-13) !important;
}

.pr-13 {
  padding-right: var(--sp-13) !important;
}

.pb-13 {
  padding-bottom: var(--sp-13) !important;
}

.pl-13 {
  padding-left: var(--sp-13) !important;
}

.p-14 {
  padding: var(--sp-14) !important;
}

.px-14 {
  padding-left: var(--sp-14) !important;
  padding-right: var(--sp-14) !important;
}

.py-14 {
  padding-top: var(--sp-14) !important;
  padding-bottom: var(--sp-14) !important;
}

.pt-14 {
  padding-top: var(--sp-14) !important;
}

.pr-14 {
  padding-right: var(--sp-14) !important;
}

.pb-14 {
  padding-bottom: var(--sp-14) !important;
}

.pl-14 {
  padding-left: var(--sp-14) !important;
}

.p-15 {
  padding: var(--sp-15) !important;
}

.px-15 {
  padding-left: var(--sp-15) !important;
  padding-right: var(--sp-15) !important;
}

.py-15 {
  padding-top: var(--sp-15) !important;
  padding-bottom: var(--sp-15) !important;
}

.pt-15 {
  padding-top: var(--sp-15) !important;
}

.pr-15 {
  padding-right: var(--sp-15) !important;
}

.pb-15 {
  padding-bottom: var(--sp-15) !important;
}

.pl-15 {
  padding-left: var(--sp-15) !important;
}

.shadow-xs {
  box-shadow: var(--shadow-xs) !important;
}

.shadow-sm {
  box-shadow: var(--shadow-sm) !important;
}

.shadow-md {
  box-shadow: var(--shadow-md) !important;
}

.shadow-lg {
  box-shadow: var(--shadow-lg) !important;
}

.shadow-xl {
  box-shadow: var(--shadow-xl) !important;
}

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

.rounded-sm {
  border-radius: var(--border-radius-sm) !important;
}

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

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

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

.rounded-full {
  border-radius: var(--border-radius-full) !important;
}

@layer lib {
  .btn, .btn-xl, .btn-lg, .btn-md, .btn-sm, .btn-xs, .btn-danger, .btn-warning, .btn-success, .btn-gray, .btn-secondary, .btn-primary {
    font-size: var(--fs-md);
    line-height: var(--flh-md);
    --btn-color: var(--black);
    --btn-bg: var(--white);
    --btn-border: 1px solid var(--gray-2);
    height: fit-content;
    width: fit-content;
    color: var(--btn-color);
    background-color: var(--btn-bg);
    border: var(--btn-border);
    padding: var(--sp-1) var(--sp-4);
    border-radius: var(--border-radius-sm);
    transition: var(--transition-md);
    cursor: pointer;
  }
  .btn:hover, .btn-xl:hover, .btn-lg:hover, .btn-md:hover, .btn-sm:hover, .btn-xs:hover, .btn-danger:hover, .btn-warning:hover, .btn-success:hover, .btn-gray:hover, .btn-secondary:hover, .btn-primary:hover {
    --btn-bg: var(--gray-0);
  }
  .btn:disabled, .btn-xl:disabled, .btn-lg:disabled, .btn-md:disabled, .btn-sm:disabled, .btn-xs:disabled, .btn-danger:disabled, .btn-warning:disabled, .btn-success:disabled, .btn-gray:disabled, .btn-secondary:disabled, .btn-primary:disabled {
    cursor: default;
    --btn-color: var(--gray-6);
    --btn-bg: var(--gray-0);
    --btn-border: 1px solid var(--gray-0);
  }
}
@layer theme {
  .btn-primary {
    --base-btn-color: var(--black);
    --base-btn-bg: var(--primary-5);
    --btn-color: var(--black);
    --btn-bg: var(--primary-5);
    --btn-border: 1px solid var(--primary-5);
  }
  .btn-primary:hover {
    --btn-bg: var(--primary-6);
  }
  .btn-primary.btn-light {
    --base-btn-color: var(--black);
    --base-btn-bg: var(--primary-1);
    --btn-color: var(--black);
    --btn-bg: var(--primary-1);
    --btn-border: 1px solid var(--primary-1);
  }
  .btn-primary.btn-light:hover {
    --btn-bg: var(--primary-3);
  }
  .btn-primary.btn-outline {
    --btn-color: var(--base-btn-bg);
    --btn-bg: transparent;
  }
  .btn-primary.btn-outline:hover {
    --btn-color: var(--base-btn-color);
    --btn-bg: var(--base-btn-bg);
  }
  .btn-primary:disabled, .btn-primary:disabled:hover {
    --btn-color: var(--primary-5);
    --btn-bg: var(--primary-2);
    --btn-border: 1px solid var(--primary-2);
  }
  .btn-primary:disabled.btn-outline, .btn-primary:disabled:hover.btn-outline {
    --btn-color: var(--primary-2);
    --btn-bg: var(--gray-0);
    --btn-border: 1px solid var(--primary-2);
  }
  .btn-secondary {
    --base-btn-color: var(--black);
    --base-btn-bg: var(--secondary-5);
    --btn-color: var(--black);
    --btn-bg: var(--secondary-5);
    --btn-border: 1px solid var(--secondary-5);
  }
  .btn-secondary:hover {
    --btn-bg: var(--secondary-6);
  }
  .btn-secondary.btn-light {
    --base-btn-color: var(--black);
    --base-btn-bg: var(--secondary-1);
    --btn-color: var(--black);
    --btn-bg: var(--secondary-1);
    --btn-border: 1px solid var(--secondary-1);
  }
  .btn-secondary.btn-light:hover {
    --btn-bg: var(--secondary-3);
  }
  .btn-secondary.btn-outline {
    --btn-color: var(--base-btn-bg);
    --btn-bg: transparent;
  }
  .btn-secondary.btn-outline:hover {
    --btn-color: var(--base-btn-color);
    --btn-bg: var(--base-btn-bg);
  }
  .btn-secondary:disabled, .btn-secondary:disabled:hover {
    --btn-color: var(--secondary-5);
    --btn-bg: var(--secondary-2);
    --btn-border: 1px solid var(--secondary-2);
  }
  .btn-secondary:disabled.btn-outline, .btn-secondary:disabled:hover.btn-outline {
    --btn-color: var(--secondary-2);
    --btn-bg: var(--gray-0);
    --btn-border: 1px solid var(--secondary-2);
  }
  .btn-gray {
    --base-btn-color: var(--white);
    --base-btn-bg: var(--gray-5);
    --btn-color: var(--white);
    --btn-bg: var(--gray-5);
    --btn-border: 1px solid var(--gray-5);
  }
  .btn-gray:hover {
    --btn-bg: var(--gray-6);
  }
  .btn-gray.btn-light {
    --base-btn-color: var(--black);
    --base-btn-bg: var(--gray-1);
    --btn-color: var(--black);
    --btn-bg: var(--gray-1);
    --btn-border: 1px solid var(--gray-1);
  }
  .btn-gray.btn-light:hover {
    --btn-bg: var(--gray-3);
  }
  .btn-gray.btn-outline {
    --btn-color: var(--base-btn-bg);
    --btn-bg: transparent;
  }
  .btn-gray.btn-outline:hover {
    --btn-color: var(--base-btn-color);
    --btn-bg: var(--base-btn-bg);
  }
  .btn-gray:disabled, .btn-gray:disabled:hover {
    --btn-color: var(--gray-5);
    --btn-bg: var(--gray-2);
    --btn-border: 1px solid var(--gray-2);
  }
  .btn-gray:disabled.btn-outline, .btn-gray:disabled:hover.btn-outline {
    --btn-color: var(--gray-2);
    --btn-bg: var(--gray-0);
    --btn-border: 1px solid var(--gray-2);
  }
  .btn-success {
    --base-btn-color: var(--white);
    --base-btn-bg: var(--success-5);
    --btn-color: var(--white);
    --btn-bg: var(--success-5);
    --btn-border: 1px solid var(--success-5);
  }
  .btn-success:hover {
    --btn-bg: var(--success-6);
  }
  .btn-success.btn-light {
    --base-btn-color: var(--black);
    --base-btn-bg: var(--success-1);
    --btn-color: var(--black);
    --btn-bg: var(--success-1);
    --btn-border: 1px solid var(--success-1);
  }
  .btn-success.btn-light:hover {
    --btn-bg: var(--success-3);
  }
  .btn-success.btn-outline {
    --btn-color: var(--base-btn-bg);
    --btn-bg: transparent;
  }
  .btn-success.btn-outline:hover {
    --btn-color: var(--base-btn-color);
    --btn-bg: var(--base-btn-bg);
  }
  .btn-success:disabled, .btn-success:disabled:hover {
    --btn-color: var(--success-5);
    --btn-bg: var(--success-2);
    --btn-border: 1px solid var(--success-2);
  }
  .btn-success:disabled.btn-outline, .btn-success:disabled:hover.btn-outline {
    --btn-color: var(--success-2);
    --btn-bg: var(--gray-0);
    --btn-border: 1px solid var(--success-2);
  }
  .btn-warning {
    --base-btn-color: var(--white);
    --base-btn-bg: var(--warning-5);
    --btn-color: var(--white);
    --btn-bg: var(--warning-5);
    --btn-border: 1px solid var(--warning-5);
  }
  .btn-warning:hover {
    --btn-bg: var(--warning-6);
  }
  .btn-warning.btn-light {
    --base-btn-color: var(--black);
    --base-btn-bg: var(--warning-1);
    --btn-color: var(--black);
    --btn-bg: var(--warning-1);
    --btn-border: 1px solid var(--warning-1);
  }
  .btn-warning.btn-light:hover {
    --btn-bg: var(--warning-3);
  }
  .btn-warning.btn-outline {
    --btn-color: var(--base-btn-bg);
    --btn-bg: transparent;
  }
  .btn-warning.btn-outline:hover {
    --btn-color: var(--base-btn-color);
    --btn-bg: var(--base-btn-bg);
  }
  .btn-warning:disabled, .btn-warning:disabled:hover {
    --btn-color: var(--warning-5);
    --btn-bg: var(--warning-2);
    --btn-border: 1px solid var(--warning-2);
  }
  .btn-warning:disabled.btn-outline, .btn-warning:disabled:hover.btn-outline {
    --btn-color: var(--warning-2);
    --btn-bg: var(--gray-0);
    --btn-border: 1px solid var(--warning-2);
  }
  .btn-danger {
    --base-btn-color: var(--white);
    --base-btn-bg: var(--danger-5);
    --btn-color: var(--white);
    --btn-bg: var(--danger-5);
    --btn-border: 1px solid var(--danger-5);
  }
  .btn-danger:hover {
    --btn-bg: var(--danger-6);
  }
  .btn-danger.btn-light {
    --base-btn-color: var(--black);
    --base-btn-bg: var(--danger-1);
    --btn-color: var(--black);
    --btn-bg: var(--danger-1);
    --btn-border: 1px solid var(--danger-1);
  }
  .btn-danger.btn-light:hover {
    --btn-bg: var(--danger-3);
  }
  .btn-danger.btn-outline {
    --btn-color: var(--base-btn-bg);
    --btn-bg: transparent;
  }
  .btn-danger.btn-outline:hover {
    --btn-color: var(--base-btn-color);
    --btn-bg: var(--base-btn-bg);
  }
  .btn-danger:disabled, .btn-danger:disabled:hover {
    --btn-color: var(--danger-5);
    --btn-bg: var(--danger-2);
    --btn-border: 1px solid var(--danger-2);
  }
  .btn-danger:disabled.btn-outline, .btn-danger:disabled:hover.btn-outline {
    --btn-color: var(--danger-2);
    --btn-bg: var(--gray-0);
    --btn-border: 1px solid var(--danger-2);
  }
  .btn-xs {
    font-size: var(--fs-xs);
    line-height: var(--flh-xs);
  }
  .btn-sm {
    font-size: var(--fs-sm);
    line-height: var(--flh-sm);
  }
  .btn-md {
    font-size: var(--fs-md);
    line-height: var(--flh-md);
  }
  .btn-lg {
    font-size: var(--fs-lg);
    line-height: var(--flh-lg);
  }
  .btn-xl {
    font-size: var(--fs-xl);
    line-height: var(--flh-xl);
  }
}
@layer lib {
  .badge {
    text-align: center;
    line-height: 1;
    color: var(--black);
    background-color: var(--transparent);
    border-radius: var(--border-radius-full);
    padding: var(--sp-1) var(--sp-4);
  }
}
@layer lib {
  .input, .input-danger, .input-warning, .input-success, .input-gray, .input-secondary, .input-primary, .input-xl, .input-lg, .input-md, .input-sm, .input-xs {
    --input-border-color: var(--gray-5);
    --input-disabled-border-color: var(--gray-0);
    --input-action-color: var(--primary);
    --input-disabled-action-color: var(--primary-2);
    --input-box-shadow: 0 0 3px 1px var(--primary-3), 0 0 0 1px var(--primary);
  }
  .input:disabled, .input-danger:disabled, .input-warning:disabled, .input-success:disabled, .input-gray:disabled, .input-secondary:disabled, .input-primary:disabled, .input-xl:disabled, .input-lg:disabled, .input-md:disabled, .input-sm:disabled, .input-xs:disabled {
    --input-border-color: var(--gray-2);
  }
  .input:not([type=radio]):not([type=checkbox]):not([type=file]), .input-danger:not([type=radio]):not([type=checkbox]):not([type=file]), .input-warning:not([type=radio]):not([type=checkbox]):not([type=file]), .input-success:not([type=radio]):not([type=checkbox]):not([type=file]), .input-gray:not([type=radio]):not([type=checkbox]):not([type=file]), .input-secondary:not([type=radio]):not([type=checkbox]):not([type=file]), .input-primary:not([type=radio]):not([type=checkbox]):not([type=file]), .input-xl:not([type=radio]):not([type=checkbox]):not([type=file]), .input-lg:not([type=radio]):not([type=checkbox]):not([type=file]), .input-md:not([type=radio]):not([type=checkbox]):not([type=file]), .input-sm:not([type=radio]):not([type=checkbox]):not([type=file]), .input-xs:not([type=radio]):not([type=checkbox]):not([type=file]),
textarea.input,
textarea.input-danger,
textarea.input-warning,
textarea.input-success,
textarea.input-gray,
textarea.input-secondary,
textarea.input-primary,
textarea.input-xl,
textarea.input-lg,
textarea.input-md,
textarea.input-sm,
textarea.input-xs {
    font-size: var(--fs-md);
    line-height: var(--flh-md);
    font-weight: normal;
    background-color: var(--white);
    padding: var(--sp-2);
    border: 1px solid var(--input-border-color);
    border-radius: var(--border-radius-md);
    transition: var(--transition-md);
  }
  .input:not([type=radio]):not([type=checkbox]):not([type=file]):focus, .input-danger:not([type=radio]):not([type=checkbox]):not([type=file]):focus, .input-warning:not([type=radio]):not([type=checkbox]):not([type=file]):focus, .input-success:not([type=radio]):not([type=checkbox]):not([type=file]):focus, .input-gray:not([type=radio]):not([type=checkbox]):not([type=file]):focus, .input-secondary:not([type=radio]):not([type=checkbox]):not([type=file]):focus, .input-primary:not([type=radio]):not([type=checkbox]):not([type=file]):focus, .input-xl:not([type=radio]):not([type=checkbox]):not([type=file]):focus, .input-lg:not([type=radio]):not([type=checkbox]):not([type=file]):focus, .input-md:not([type=radio]):not([type=checkbox]):not([type=file]):focus, .input-sm:not([type=radio]):not([type=checkbox]):not([type=file]):focus, .input-xs:not([type=radio]):not([type=checkbox]):not([type=file]):focus,
textarea.input:focus,
textarea.input-danger:focus,
textarea.input-warning:focus,
textarea.input-success:focus,
textarea.input-gray:focus,
textarea.input-secondary:focus,
textarea.input-primary:focus,
textarea.input-xl:focus,
textarea.input-lg:focus,
textarea.input-md:focus,
textarea.input-sm:focus,
textarea.input-xs:focus {
    outline: none;
    border-color: var(--input-action-color);
  }
  .input:not([type=radio]):not([type=checkbox]):not([type=file]):disabled, .input-danger:not([type=radio]):not([type=checkbox]):not([type=file]):disabled, .input-warning:not([type=radio]):not([type=checkbox]):not([type=file]):disabled, .input-success:not([type=radio]):not([type=checkbox]):not([type=file]):disabled, .input-gray:not([type=radio]):not([type=checkbox]):not([type=file]):disabled, .input-secondary:not([type=radio]):not([type=checkbox]):not([type=file]):disabled, .input-primary:not([type=radio]):not([type=checkbox]):not([type=file]):disabled, .input-xl:not([type=radio]):not([type=checkbox]):not([type=file]):disabled, .input-lg:not([type=radio]):not([type=checkbox]):not([type=file]):disabled, .input-md:not([type=radio]):not([type=checkbox]):not([type=file]):disabled, .input-sm:not([type=radio]):not([type=checkbox]):not([type=file]):disabled, .input-xs:not([type=radio]):not([type=checkbox]):not([type=file]):disabled,
textarea.input:disabled,
textarea.input-danger:disabled,
textarea.input-warning:disabled,
textarea.input-success:disabled,
textarea.input-gray:disabled,
textarea.input-secondary:disabled,
textarea.input-primary:disabled,
textarea.input-xl:disabled,
textarea.input-lg:disabled,
textarea.input-md:disabled,
textarea.input-sm:disabled,
textarea.input-xs:disabled {
    background-color: var(--input-disabled-border-color);
  }
  .input[type=checkbox], [type=checkbox].input-danger, [type=checkbox].input-warning, [type=checkbox].input-success, [type=checkbox].input-gray, [type=checkbox].input-secondary, [type=checkbox].input-primary, [type=checkbox].input-xl, [type=checkbox].input-lg, [type=checkbox].input-md, [type=checkbox].input-sm, [type=checkbox].input-xs, .input[type=radio], [type=radio].input-danger, [type=radio].input-warning, [type=radio].input-success, [type=radio].input-gray, [type=radio].input-secondary, [type=radio].input-primary, [type=radio].input-xl, [type=radio].input-lg, [type=radio].input-md, [type=radio].input-sm, [type=radio].input-xs {
    /* reset */
    appearance: none;
    position: relative;
    margin: 0 8px 0 0;
    display: inline-block;
    /* styling */
    --radio-width: 18px;
    background-color: var(--white);
    vertical-align: middle;
    width: var(--radio-width);
    height: var(--radio-width);
    border: 1px solid var(--input-border-color);
    transition: var(--transition-duration-md);
  }
  .input[type=checkbox][type=radio], .input[type=radio][type=radio], [type=radio][type=radio].input-danger, [type=radio][type=radio].input-warning, [type=radio][type=radio].input-success, [type=radio][type=radio].input-gray, [type=radio][type=radio].input-secondary, [type=radio][type=radio].input-primary, [type=radio][type=radio].input-xl, [type=radio][type=radio].input-lg, [type=radio][type=radio].input-md, [type=radio][type=radio].input-sm, [type=radio][type=radio].input-xs {
    border-radius: 50%;
  }
  .input[type=checkbox]:checked, [type=checkbox].input-danger:checked, [type=checkbox].input-warning:checked, [type=checkbox].input-success:checked, [type=checkbox].input-gray:checked, [type=checkbox].input-secondary:checked, [type=checkbox].input-primary:checked, [type=checkbox].input-xl:checked, [type=checkbox].input-lg:checked, [type=checkbox].input-md:checked, [type=checkbox].input-sm:checked, [type=checkbox].input-xs:checked, .input[type=radio]:checked, [type=radio].input-danger:checked, [type=radio].input-warning:checked, [type=radio].input-success:checked, [type=radio].input-gray:checked, [type=radio].input-secondary:checked, [type=radio].input-primary:checked, [type=radio].input-xl:checked, [type=radio].input-lg:checked, [type=radio].input-md:checked, [type=radio].input-sm:checked, [type=radio].input-xs:checked {
    background-color: var(--input-action-color);
  }
  .input[type=checkbox]:checked:not([role=switch]), [type=checkbox].input-danger:checked:not([role=switch]), [type=checkbox].input-warning:checked:not([role=switch]), [type=checkbox].input-success:checked:not([role=switch]), [type=checkbox].input-gray:checked:not([role=switch]), [type=checkbox].input-secondary:checked:not([role=switch]), [type=checkbox].input-primary:checked:not([role=switch]), [type=checkbox].input-xl:checked:not([role=switch]), [type=checkbox].input-lg:checked:not([role=switch]), [type=checkbox].input-md:checked:not([role=switch]), [type=checkbox].input-sm:checked:not([role=switch]), [type=checkbox].input-xs:checked:not([role=switch]), .input[type=radio]:checked:not([role=switch]), [type=radio].input-danger:checked:not([role=switch]), [type=radio].input-warning:checked:not([role=switch]), [type=radio].input-success:checked:not([role=switch]), [type=radio].input-gray:checked:not([role=switch]), [type=radio].input-secondary:checked:not([role=switch]), [type=radio].input-primary:checked:not([role=switch]), [type=radio].input-xl:checked:not([role=switch]), [type=radio].input-lg:checked:not([role=switch]), [type=radio].input-md:checked:not([role=switch]), [type=radio].input-sm:checked:not([role=switch]), [type=radio].input-xs:checked:not([role=switch]) {
    box-shadow: inset 0 0 0 2px white;
  }
  .input[type=checkbox]:disabled:checked, [type=checkbox].input-danger:disabled:checked, [type=checkbox].input-warning:disabled:checked, [type=checkbox].input-success:disabled:checked, [type=checkbox].input-gray:disabled:checked, [type=checkbox].input-secondary:disabled:checked, [type=checkbox].input-primary:disabled:checked, [type=checkbox].input-xl:disabled:checked, [type=checkbox].input-lg:disabled:checked, [type=checkbox].input-md:disabled:checked, [type=checkbox].input-sm:disabled:checked, [type=checkbox].input-xs:disabled:checked, .input[type=radio]:disabled:checked, [type=radio].input-danger:disabled:checked, [type=radio].input-warning:disabled:checked, [type=radio].input-success:disabled:checked, [type=radio].input-gray:disabled:checked, [type=radio].input-secondary:disabled:checked, [type=radio].input-primary:disabled:checked, [type=radio].input-xl:disabled:checked, [type=radio].input-lg:disabled:checked, [type=radio].input-md:disabled:checked, [type=radio].input-sm:disabled:checked, [type=radio].input-xs:disabled:checked {
    background-color: var(--input-disabled-action-color);
  }
  .input[type=checkbox][role=switch], [type=checkbox][role=switch].input-danger, [type=checkbox][role=switch].input-warning, [type=checkbox][role=switch].input-success, [type=checkbox][role=switch].input-gray, [type=checkbox][role=switch].input-secondary, [type=checkbox][role=switch].input-primary, [type=checkbox][role=switch].input-xl, [type=checkbox][role=switch].input-lg, [type=checkbox][role=switch].input-md, [type=checkbox][role=switch].input-sm, [type=checkbox][role=switch].input-xs, .input[type=radio][role=switch], [type=radio][role=switch].input-danger, [type=radio][role=switch].input-warning, [type=radio][role=switch].input-success, [type=radio][role=switch].input-gray, [type=radio][role=switch].input-secondary, [type=radio][role=switch].input-primary, [type=radio][role=switch].input-xl, [type=radio][role=switch].input-lg, [type=radio][role=switch].input-md, [type=radio][role=switch].input-sm, [type=radio][role=switch].input-xs {
    border-radius: var(--border-radius-full);
    width: calc(2 * var(--radio-width));
  }
  .input[type=checkbox][role=switch]::before, [type=checkbox][role=switch].input-danger::before, [type=checkbox][role=switch].input-warning::before, [type=checkbox][role=switch].input-success::before, [type=checkbox][role=switch].input-gray::before, [type=checkbox][role=switch].input-secondary::before, [type=checkbox][role=switch].input-primary::before, [type=checkbox][role=switch].input-xl::before, [type=checkbox][role=switch].input-lg::before, [type=checkbox][role=switch].input-md::before, [type=checkbox][role=switch].input-sm::before, [type=checkbox][role=switch].input-xs::before, .input[type=radio][role=switch]::before, [type=radio][role=switch].input-danger::before, [type=radio][role=switch].input-warning::before, [type=radio][role=switch].input-success::before, [type=radio][role=switch].input-gray::before, [type=radio][role=switch].input-secondary::before, [type=radio][role=switch].input-primary::before, [type=radio][role=switch].input-xl::before, [type=radio][role=switch].input-lg::before, [type=radio][role=switch].input-md::before, [type=radio][role=switch].input-sm::before, [type=radio][role=switch].input-xs::before {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 3px;
    transition: var(--transition-sm);
    border-radius: 50%;
    background-color: var(--input-action-color);
    width: calc(var(--radio-width) - 6px);
    height: calc(var(--radio-width) - 6px);
  }
  .input[type=checkbox][role=switch]:disabled::before, [type=checkbox][role=switch].input-danger:disabled::before, [type=checkbox][role=switch].input-warning:disabled::before, [type=checkbox][role=switch].input-success:disabled::before, [type=checkbox][role=switch].input-gray:disabled::before, [type=checkbox][role=switch].input-secondary:disabled::before, [type=checkbox][role=switch].input-primary:disabled::before, [type=checkbox][role=switch].input-xl:disabled::before, [type=checkbox][role=switch].input-lg:disabled::before, [type=checkbox][role=switch].input-md:disabled::before, [type=checkbox][role=switch].input-sm:disabled::before, [type=checkbox][role=switch].input-xs:disabled::before, .input[type=radio][role=switch]:disabled::before, [type=radio][role=switch].input-danger:disabled::before, [type=radio][role=switch].input-warning:disabled::before, [type=radio][role=switch].input-success:disabled::before, [type=radio][role=switch].input-gray:disabled::before, [type=radio][role=switch].input-secondary:disabled::before, [type=radio][role=switch].input-primary:disabled::before, [type=radio][role=switch].input-xl:disabled::before, [type=radio][role=switch].input-lg:disabled::before, [type=radio][role=switch].input-md:disabled::before, [type=radio][role=switch].input-sm:disabled::before, [type=radio][role=switch].input-xs:disabled::before {
    background-color: var(--input-disabled-action-color);
  }
  .input[type=checkbox][role=switch]:checked::before, [type=checkbox][role=switch].input-danger:checked::before, [type=checkbox][role=switch].input-warning:checked::before, [type=checkbox][role=switch].input-success:checked::before, [type=checkbox][role=switch].input-gray:checked::before, [type=checkbox][role=switch].input-secondary:checked::before, [type=checkbox][role=switch].input-primary:checked::before, [type=checkbox][role=switch].input-xl:checked::before, [type=checkbox][role=switch].input-lg:checked::before, [type=checkbox][role=switch].input-md:checked::before, [type=checkbox][role=switch].input-sm:checked::before, [type=checkbox][role=switch].input-xs:checked::before, .input[type=radio][role=switch]:checked::before, [type=radio][role=switch].input-danger:checked::before, [type=radio][role=switch].input-warning:checked::before, [type=radio][role=switch].input-success:checked::before, [type=radio][role=switch].input-gray:checked::before, [type=radio][role=switch].input-secondary:checked::before, [type=radio][role=switch].input-primary:checked::before, [type=radio][role=switch].input-xl:checked::before, [type=radio][role=switch].input-lg:checked::before, [type=radio][role=switch].input-md:checked::before, [type=radio][role=switch].input-sm:checked::before, [type=radio][role=switch].input-xs:checked::before {
    left: 100%;
    transform: translate(calc(-100% - 3px), -50%);
    background-color: var(--white);
  }
  .input-xs {
    font-size: var(--fs-xs);
    line-height: var(--flh-xs);
  }
  .input-sm {
    font-size: var(--fs-sm);
    line-height: var(--flh-sm);
  }
  .input-md {
    font-size: var(--fs-md);
    line-height: var(--flh-md);
  }
  .input-lg {
    font-size: var(--fs-lg);
    line-height: var(--flh-lg);
  }
  .input-xl {
    font-size: var(--fs-xl);
    line-height: var(--flh-xl);
  }
}
@layer theme {
  .input-primary {
    --input-action-color: var(--primary);
    --input-disabled-action-color: var(--primary-2);
    --input-box-shadow: 0 0 3px 1px var(--primary-3), 0 0 0 1px var(--primary);
  }
  .input-secondary {
    --input-action-color: var(--secondary);
    --input-disabled-action-color: var(--secondary-2);
    --input-box-shadow: 0 0 3px 1px var(--secondary-3), 0 0 0 1px var(--secondary);
  }
  .input-gray {
    --input-action-color: var(--gray);
    --input-disabled-action-color: var(--gray-2);
    --input-box-shadow: 0 0 3px 1px var(--gray-3), 0 0 0 1px var(--gray);
  }
  .input-success {
    --input-action-color: var(--success);
    --input-disabled-action-color: var(--success-2);
    --input-box-shadow: 0 0 3px 1px var(--success-3), 0 0 0 1px var(--success);
  }
  .input-warning {
    --input-action-color: var(--warning);
    --input-disabled-action-color: var(--warning-2);
    --input-box-shadow: 0 0 3px 1px var(--warning-3), 0 0 0 1px var(--warning);
  }
  .input-danger {
    --input-action-color: var(--danger);
    --input-disabled-action-color: var(--danger-2);
    --input-box-shadow: 0 0 3px 1px var(--danger-3), 0 0 0 1px var(--danger);
  }
}
@layer layout {
  .input-grp {
    display: flex;
  }
  .input-grp > * {
    padding: var(--sp-2) var(--sp-4);
    border-radius: 0;
  }
  .input-grp > *:first-child {
    border-top-left-radius: var(--border-radius-md);
    border-bottom-left-radius: var(--border-radius-md);
  }
  .input-grp > *:last-child {
    border-top-right-radius: var(--border-radius-md);
    border-bottom-right-radius: var(--border-radius-md);
  }
}
.navbar {
  z-index: 10000;
  transform: translateZ(1000px);
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: var(--navbar-height);
  background-color: rgba(244, 210, 169, 0.63);
  backdrop-filter: blur(8px);
  border-bottom-left-radius: 24px;
  border-bottom-right-radius: 24px;
  box-shadow: var(--shadow-md);
  padding: var(--sp-4) var(--sp-8);
  display: flex;
  gap: var(--sp-4);
  align-items: center;
}
.navbar .navbar-brand img {
  height: calc(var(--navbar-height) - 2 * var(--sp-4));
  width: auto;
}
.navbar .contact {
  margin-left: auto;
}
.navbar ul.navbar-link-list {
  list-style: none;
  height: 100%;
  display: flex;
  align-items: center;
  column-gap: var(--sp-5);
  flex-grow: 1;
}
.navbar ul.navbar-link-list li {
  height: 100%;
  display: flex;
  align-items: center;
}
.navbar ul.navbar-link-list li a {
  display: block;
  position: relative;
  transition: var(--transition-md);
  overflow: hidden;
  padding-bottom: 2px;
}
.navbar ul.navbar-link-list li a::before {
  position: absolute;
  content: "";
  bottom: 0;
  width: 100%;
  height: 2px;
  background-color: var(--secondary-7);
  left: -100%;
  transition: var(--transition-md);
}
.navbar ul.navbar-link-list li a:hover {
  color: var(--secondary-7);
}
.navbar ul.navbar-link-list li.navbar-link-active a::before {
  left: 0;
}
.navbar .hamburger-container {
  display: none;
}
@media (max-width: 600px) {
  .navbar {
    justify-content: space-between;
  }
  .navbar .contact {
    margin: 0;
  }
  .navbar ul.navbar-link-list {
    z-index: -1;
    position: fixed;
    height: calc(100vh + 16px);
    width: 100vw;
    padding-top: var(--navbar-height);
    transform: translateY(-100%);
    row-gap: var(--sp-4);
    left: 0;
    top: 0;
    background-color: var(--primary-2);
    backdrop-filter: blur(10px);
    flex-direction: column;
    align-items: center;
    transition: var(--transition-xl);
  }
  .navbar ul.navbar-link-list li {
    text-align: left;
  }
  .navbar.navbar-open ul.navbar-link-list {
    transform: translateY(0);
  }
  .navbar .hamburger-container {
    display: block;
  }
}

@layer lib {
  .hamburger-container {
    display: inline-block;
    position: relative;
    padding: var(--sp-3);
    z-index: 1000;
    cursor: pointer;
    transition: var(--transition-md);
  }
  .hamburger {
    --margin: 6px;
    margin: var(--margin) 0;
    position: relative;
    transition: var(--transition-md);
  }
  .hamburger, .hamburger::before, .hamburger::after {
    background-color: var(--black);
    height: 2px;
    width: 24px;
    cursor: pointer;
    transition: var(--transition-md);
  }
  .hamburger::before, .hamburger::after {
    content: "";
    display: block;
    position: absolute;
  }
  .hamburger::before {
    top: calc(-1 * var(--margin));
  }
  .hamburger::after {
    top: var(--margin);
  }
  .hamburger.open {
    background-color: rgba(0, 0, 0, 0);
  }
  .hamburger.open::before {
    transform: translateY(6px) rotate(45deg);
  }
  .hamburger.open::after {
    transform: translateY(-6px) rotate(-45deg);
  }
}
@layer lib {
  .table-container {
    max-width: 100%;
    width: 100%;
    overflow-x: auto;
  }
  .table-container table, .table, .table-danger, .table-warning, .table-success, .table-gray, .table-secondary, .table-primary {
    width: 100%;
    border-collapse: collapse;
    --table-action-color: var(--primary-3);
  }
  .table-container table thead > tr.total-row, .table thead > tr.total-row, .table-danger thead > tr.total-row, .table-warning thead > tr.total-row, .table-success thead > tr.total-row, .table-gray thead > tr.total-row, .table-secondary thead > tr.total-row, .table-primary thead > tr.total-row {
    border-top: 2px solid var(--gray-2);
  }
  .table-container table thead > tr.total-row > td, .table-container table thead > tr.total-row > th, .table thead > tr.total-row > td, .table-danger thead > tr.total-row > td, .table-warning thead > tr.total-row > td, .table-success thead > tr.total-row > td, .table-gray thead > tr.total-row > td, .table-secondary thead > tr.total-row > td, .table-primary thead > tr.total-row > td, .table thead > tr.total-row > th, .table-danger thead > tr.total-row > th, .table-warning thead > tr.total-row > th, .table-success thead > tr.total-row > th, .table-gray thead > tr.total-row > th, .table-secondary thead > tr.total-row > th, .table-primary thead > tr.total-row > th {
    background-color: var(--table-action-color);
  }
  .table-container table thead > tr > th, .table-container table thead > tr > td, .table thead > tr > th, .table-danger thead > tr > th, .table-warning thead > tr > th, .table-success thead > tr > th, .table-gray thead > tr > th, .table-secondary thead > tr > th, .table-primary thead > tr > th, .table thead > tr > td, .table-danger thead > tr > td, .table-warning thead > tr > td, .table-success thead > tr > td, .table-gray thead > tr > td, .table-secondary thead > tr > td, .table-primary thead > tr > td {
    text-align: left;
    padding: var(--sp-3);
    transition: var(--transition);
  }
  .table-container table thead > tr:first-child > th, .table-container table thead > tr:first-child > td, .table thead > tr:first-child > th, .table-danger thead > tr:first-child > th, .table-warning thead > tr:first-child > th, .table-success thead > tr:first-child > th, .table-gray thead > tr:first-child > th, .table-secondary thead > tr:first-child > th, .table-primary thead > tr:first-child > th, .table thead > tr:first-child > td, .table-danger thead > tr:first-child > td, .table-warning thead > tr:first-child > td, .table-success thead > tr:first-child > td, .table-gray thead > tr:first-child > td, .table-secondary thead > tr:first-child > td, .table-primary thead > tr:first-child > td {
    border-top: 1px solid var(--gray-2);
  }
  .table-container table thead > tr:last-child > th, .table-container table thead > tr:last-child > td, .table thead > tr:last-child > th, .table-danger thead > tr:last-child > th, .table-warning thead > tr:last-child > th, .table-success thead > tr:last-child > th, .table-gray thead > tr:last-child > th, .table-secondary thead > tr:last-child > th, .table-primary thead > tr:last-child > th, .table thead > tr:last-child > td, .table-danger thead > tr:last-child > td, .table-warning thead > tr:last-child > td, .table-success thead > tr:last-child > td, .table-gray thead > tr:last-child > td, .table-secondary thead > tr:last-child > td, .table-primary thead > tr:last-child > td {
    border-bottom: 2px solid var(--gray-2);
  }
  .table-container table tbody > tr > td, .table tbody > tr > td, .table-danger tbody > tr > td, .table-warning tbody > tr > td, .table-success tbody > tr > td, .table-gray tbody > tr > td, .table-secondary tbody > tr > td, .table-primary tbody > tr > td {
    padding: var(--sp-3);
    border-top: 1px solid var(--gray-2);
    transition: var(--transition-xs);
  }
  .table-container table tbody > tr > td.action-cell svg, .table tbody > tr > td.action-cell svg, .table-danger tbody > tr > td.action-cell svg, .table-warning tbody > tr > td.action-cell svg, .table-success tbody > tr > td.action-cell svg, .table-gray tbody > tr > td.action-cell svg, .table-secondary tbody > tr > td.action-cell svg, .table-primary tbody > tr > td.action-cell svg {
    min-width: 1em;
  }
  .table-container table tfoot, .table tfoot, .table-danger tfoot, .table-warning tfoot, .table-success tfoot, .table-gray tfoot, .table-secondary tfoot, .table-primary tfoot {
    box-shadow: -2px -2px 4px 0px rgba(0, 0, 0, 0.2);
  }
  .table-container table tfoot > tr > td, .table tfoot > tr > td, .table-danger tfoot > tr > td, .table-warning tfoot > tr > td, .table-success tfoot > tr > td, .table-gray tfoot > tr > td, .table-secondary tfoot > tr > td, .table-primary tfoot > tr > td {
    padding: var(--sp-3);
    transition: var(--transition-xs);
    background-color: var(--table-action-color);
  }
  .table-container table.table-striped tbody > tr:nth-child(2n+1) > td, .table.table-striped tbody > tr:nth-child(2n+1) > td, .table-striped.table-danger tbody > tr:nth-child(2n+1) > td, .table-striped.table-warning tbody > tr:nth-child(2n+1) > td, .table-striped.table-success tbody > tr:nth-child(2n+1) > td, .table-striped.table-gray tbody > tr:nth-child(2n+1) > td, .table-striped.table-secondary tbody > tr:nth-child(2n+1) > td, .table-striped.table-primary tbody > tr:nth-child(2n+1) > td {
    background-color: var(--primary-0);
  }
  .table-container table.table-hover tbody > tr:hover > td, .table.table-hover tbody > tr:hover > td, .table-hover.table-danger tbody > tr:hover > td, .table-hover.table-warning tbody > tr:hover > td, .table-hover.table-success tbody > tr:hover > td, .table-hover.table-gray tbody > tr:hover > td, .table-hover.table-secondary tbody > tr:hover > td, .table-hover.table-primary tbody > tr:hover > td {
    background-color: var(--primary-1);
  }
  ul.paging {
    list-style: none;
    display: flex;
    column-gap: var(--sp-3);
  }
  ul.paging li button.arrow {
    border: none;
    background: none;
    color: var(--primary);
    cursor: pointer;
    padding: 0 var(--sp-4);
  }
  ul.paging li button.arrow:disabled {
    color: var(--gray-3);
    cursor: default;
  }
  ul.paging li button.expand {
    cursor: default;
    height: 100%;
    background: none;
    border: none;
    color: var(--gray-5);
    padding: 0;
  }
}
@layer theme {
  .table-primary {
    --table-action-color: var(--primary-3);
  }
  .table-secondary {
    --table-action-color: var(--secondary-3);
  }
  .table-gray {
    --table-action-color: var(--gray-3);
  }
  .table-success {
    --table-action-color: var(--success-3);
  }
  .table-warning {
    --table-action-color: var(--warning-3);
  }
  .table-danger {
    --table-action-color: var(--danger-3);
  }
}
@layer lib {
  ul.carousel {
    scroll-behavior: smooth;
    position: relative;
    list-style: none;
    display: flex;
    width: 100%;
    max-width: 100%;
    height: 100%;
    max-height: 100%;
    overflow: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: thin;
    scrollbar-color: transparent transparent;
    scrollbar-track-color: transparent;
  }
  ul.carousel::-webkit-scrollbar {
    background-color: transparent;
  }
  ul.carousel::-webkit-scrollbar-track {
    background-color: transparent;
  }
  ul.carousel::-webkit-scrollbar-thumb {
    background-color: transparent;
  }
  ul.carousel li {
    min-width: 100%;
    max-width: 100%;
    min-height: 100%;
    max-height: 100%;
    scroll-snap-align: center;
  }
}
@layer lib {
  .modal {
    z-index: 1002;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: grid;
    place-items: center;
    background-color: rgba(0, 0, 0, 0.4);
  }
  .modal .modal__container {
    height: 75%;
    max-height: 75%;
    width: 60%;
    border-radius: var(--border-radius-md);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background-color: var(--white);
  }
  .modal .modal__container.xs {
    width: 40%;
  }
  .modal .modal__container.sm {
    width: 40%;
  }
  .modal .modal__container.md {
    width: 60%;
  }
  .modal .modal__container.lg {
    width: 70%;
  }
  .modal .modal__container.xl {
    width: 80%;
  }
  .modal .modal__container .modal__header {
    display: flex;
    justify-content: space-between;
    padding: var(--sp-4) 0;
    margin: 0 var(--sp-8);
    border-bottom: 1px solid var(--gray-1);
  }
  .modal .modal__container .modal__content {
    padding: var(--sp-4) var(--sp-8);
    overflow: auto;
  }
}
@layer lib {
  :root {
    font-size: 16px;
    --font: roboto;
    --font-title: Amatic SC, Petit Formal;
    --white: #fff;
    --black: #000;
    --content-width: min(1100px, 100%);
    --navbar-height: 4rem;
    --primary-fg: var(--black);
    --primary: #e79d43;
    --primary-0: #fdf5ec;
    --primary-1: #f8e4ca;
    --primary-2: #f4d2a9;
    --primary-3: #f0c087;
    --primary-4: #ebaf65;
    --primary-5: #e79d43;
    --primary-6: #d9831c;
    --primary-7: #a96716;
    --primary-8: #7a4a10;
    --primary-9: #4a2d09;
    --primary-10: #1a1003;
    --secondary-fg: var(--black);
    --secondary: #64b587;
    --secondary-0: #f0f8f3;
    --secondary-1: #d4eadd;
    --secondary-2: #b8ddc8;
    --secondary-3: #9cd0b2;
    --secondary-4: #80c29d;
    --secondary-5: #64b587;
    --secondary-6: #4a9c6e;
    --secondary-7: #3a7a56;
    --secondary-8: #2a573e;
    --secondary-9: #193525;
    --secondary-10: #09130d;
    --gray-fg: var(--white);
    --gray: #c3c3c3;
    --gray-0: #f9f9f9;
    --gray-1: #eeeeee;
    --gray-2: #e3e3e3;
    --gray-3: #d9d9d9;
    --gray-4: #cecece;
    --gray-5: #c3c3c3;
    --gray-6: #a0a0a0;
    --gray-7: #7d7d7d;
    --gray-8: #5a5a5a;
    --gray-9: #373737;
    --gray-10: #141414;
    --success-fg: var(--white);
    --success: #3da949;
    --success-0: #eaf8ec;
    --success-1: #c5eac9;
    --success-2: #a0dda7;
    --success-3: #7bcf85;
    --success-4: #56c262;
    --success-5: #3da949;
    --success-6: #328b3c;
    --success-7: #276c2f;
    --success-8: #1c4e22;
    --success-9: #112f14;
    --success-10: #061107;
    --warning-fg: var(--white);
    --warning: #ffa51a;
    --warning-0: #fff6e8;
    --warning-1: #ffe6bf;
    --warning-2: #ffd696;
    --warning-3: #ffc56c;
    --warning-4: #ffb543;
    --warning-5: #ffa51a;
    --warning-6: #e68c00;
    --warning-7: #b46d00;
    --warning-8: #814e00;
    --warning-9: #4f3000;
    --warning-10: #1c1100;
    --danger-fg: var(--white);
    --danger: #e34835;
    --danger-0: #fcedeb;
    --danger-1: #f7ccc6;
    --danger-2: #f2aba2;
    --danger-3: #ed8a7e;
    --danger-4: #e86959;
    --danger-5: #e34835;
    --danger-6: #ca2f1c;
    --danger-7: #9d2516;
    --danger-8: #711a10;
    --danger-9: #45100a;
    --danger-10: #190603;
    --sp-0: 0;
    --spm-0: 0;
    --sp-1: 0.125rem;
    --spm-1: 0.125em;
    --sp-2: 0.25rem;
    --spm-2: 0.25em;
    --sp-3: 0.375rem;
    --spm-3: 0.375em;
    --sp-4: 0.5rem;
    --spm-4: 0.5em;
    --sp-5: 0.75rem;
    --spm-5: 0.75em;
    --sp-6: 1rem;
    --spm-6: 1em;
    --sp-7: 1.5rem;
    --spm-7: 1.5em;
    --sp-8: 2rem;
    --spm-8: 2em;
    --sp-9: 3rem;
    --spm-9: 3em;
    --sp-10: 4rem;
    --spm-10: 4em;
    --sp-11: 6rem;
    --spm-11: 6em;
    --sp-12: 8rem;
    --spm-12: 8em;
    --sp-13: 12rem;
    --spm-13: 12em;
    --sp-14: 16rem;
    --spm-14: 16em;
    --sp-15: 24rem;
    --spm-15: 24em;
    --transition-cubic-bezier: cubic-bezier(0.4, 0, 0.2, 1);
    --breakpoint-xs: 576px;
    --breakpoint-sm: 768px;
    --breakpoint-md: 992px;
    --breakpoint-lg: 1200px;
    --breakpoint-xl: 1400px;
    --border-radius-xs: 2px;
    --border-radius-sm: 4px;
    --border-radius-md: 6px;
    --border-radius-lg: 8px;
    --border-radius-xl: 12px;
    --border-radius-full: 100vmax;
    --shadow-xs: 1px 1px 2px 0 rgba(0, 0, 0, 0.1);
    --shadow-sm: 1px 1px 3px 0 rgba(0, 0, 0, 0.1), 1px 1px 2px -1px rgba(0, 0, 0, 0.1);
    --shadow-md: 2px 4px 6px -1px rgba(0, 0, 0, 0.1), 1px 2px 4px -2px rgba(0, 0, 0, 0.1);
    --shadow-lg: 3px 8px 12px -3px rgba(0, 0, 0, 0.1), 1px 4px 6px -4px rgba(0, 0, 0, 0.1);
    --shadow-xl: 5px 14px 20px -5px rgba(0, 0, 0, 0.1), 3px 6px 6px -6px rgba(0, 0, 0, 0.1);
    --fs-xs: 0.75rem;
    --fs-sm: 0.875rem;
    --fs-md: 1rem;
    --fs-lg: 1.125rem;
    --fs-xl: 1.25rem;
    --fs-2xl: 1.5rem;
    --fs-3xl: 1.875rem;
    --fs-4xl: 2.25rem;
    --fs-5xl: 3rem;
    --fs-6xl: 3.75rem;
    --fs-7xl: 4.5rem;
    --fs-8xl: 6rem;
    --fs-9xl: 8rem;
    --flh-xs: 1rem;
    --flh-sm: 1.25rem;
    --flh-md: 1.5rem;
    --flh-lg: 1.75rem;
    --flh-xl: 1.75rem;
    --flh-2xl: 2rem;
    --flh-3xl: 2.25rem;
    --flh-4xl: 2.5rem;
    --flh-5xl: 1;
    --flh-6xl: 1;
    --flh-7xl: 1;
    --flh-8xl: 1;
    --flh-9xl: 1;
    --transition-duration-xs: 150ms;
    --transition-duration-sm: 180ms;
    --transition-duration-md: 230ms;
    --transition-duration-lg: 350ms;
    --transition-duration-xl: 500ms;
    --transition-xs: all var(--transition-cubic-bezier) var(--transition-duration-xs);
    --transition-sm: all var(--transition-cubic-bezier) var(--transition-duration-sm);
    --transition-md: all var(--transition-cubic-bezier) var(--transition-duration-md);
    --transition-lg: all var(--transition-cubic-bezier) var(--transition-duration-lg);
    --transition-xl: all var(--transition-cubic-bezier) var(--transition-duration-xl);
  }
}

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