@layer reset, abstracts, base, components, layout, utilities, pages;
@layer reset.reboot {
  *,
  *::before,
  *::after {
    box-sizing: border-box;
  }
  @media (prefers-reduced-motion: no-preference) {
    *:focus-visible {
      transition: outline-offset 75ms ease-out;
      outline-offset: 0.2rem;
      outline: var(--theme-on-primary) auto;
    }
    *:not(:active):focus-visible {
      transition-duration: 0.25s;
    }
  }
  *:not(:active):focus-visible {
    outline-offset: 0.3rem;
    outline: var(--theme-on-primary) auto;
  }
  html {
    scroll-behavior: auto;
    -webkit-text-size-adjust: 100%;
    line-height: 1.15;
  }
  html:is(.dark-mode) :where(.form-color) {
    color-scheme: dark light;
  }
  @media (prefers-reduced-motion: no-preference) {
    html {
      scroll-behavior: smooth;
    }
  }
  body {
    margin: 0;
    font-family: "Mona Sans", "Roboto", -apple-system, "Segoe UI", sans-serif;
    font-weight: 400;
    color: var(--theme-on-primary);
    background-color: var(--theme-background);
    font-size: 14px;
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: transparent;
  }
  body:has(.dialog[open]) {
    overflow-y: hidden;
  }
  body:has(.slide-enter-active, .slide-leave-active) {
    overflow-x: hidden;
  }
  body:has(.v-popper__popper--no-positioning) {
    overflow-y: hidden;
  }
  main {
    display: block;
  }
  hr {
    box-sizing: content-box;
    overflow: visible;
    height: 1px;
    border: 0;
    border-top: 1px solid var(--theme-outline-button);
    opacity: 0.95;
    margin: 1rem 0;
  }
  .vr {
    display: inline-block;
    width: 1px;
    min-height: 1em;
    background: var(--theme-outline-button);
    opacity: 0.85;
  }
  code,
  kbd,
  samp,
  pre {
    font-family: monospace;
    font-size: 1em;
  }
  pre {
    white-space: pre-wrap;
  }
  abbr[title] {
    text-decoration: underline dotted;
    cursor: help;
    text-decoration-skip-ink: none;
  }
  address {
    margin-bottom: 1rem;
    font-style: normal;
    line-height: inherit;
  }
  ol,
  ul {
    padding-left: 2rem;
  }
  ol,
  ul,
  dl {
    margin-top: 0;
    margin-bottom: 1rem;
  }
  ol ol,
  ul ul,
  ol ul,
  ul ol {
    margin-bottom: 0;
  }
  dt {
    font-weight: 500;
  }
  dd {
    margin-bottom: 0.5rem;
    margin-left: 0;
  }
  blockquote {
    margin: 0 0 1rem;
  }
  b,
  strong {
    font-weight: 800;
  }
  /**
  * Prevent `sub` and `sup` elements from affecting the line height in
  * all browsers.
  */
  sub,
  sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
  }
  sub {
    bottom: -0.25em;
  }
  sup {
    top: -0.5em;
  }
  img {
    border-style: none;
  }
  button,
  input,
  optgroup,
  select,
  textarea {
    font-family: inherit;
    font-size: 100%;
    line-height: 1.15;
    margin: 0;
  }
  a:not([href]):not([class]), a:not([href]):not([class]):hover {
    color: inherit;
    text-decoration: none;
  }
  figure {
    margin: 0 0 1rem;
  }
  img,
  svg {
    vertical-align: middle;
  }
  button,
  input {
    overflow: visible;
  }
  button,
  select {
    text-transform: none;
  }
  button:focus:not(:focus-visible) {
    outline: 0;
  }
  button,
  [type=button],
  [type=reset],
  [type=submit] {
    -webkit-appearance: button;
  }
  label {
    display: inline-block;
  }
  input,
  button,
  select,
  optgroup,
  textarea {
    margin: 0;
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
  }
  [role=button] {
    cursor: pointer;
  }
  select {
    word-wrap: normal;
  }
  select:disabled {
    opacity: 1;
  }
  [list]:not([type=date]):not([type=datetime-local]):not([type=month]):not([type=week]):not([type=time])::-webkit-calendar-picker-indicator {
    display: none !important;
  }
  ::-moz-focus-inner {
    padding: 0;
    border-style: none;
  }
  textarea {
    resize: vertical;
  }
  fieldset {
    min-width: 0;
    padding: 0;
    margin: 0;
    border: 0;
  }
  ::-webkit-datetime-edit-fields-wrapper,
  ::-webkit-datetime-edit-text,
  ::-webkit-datetime-edit-minute,
  ::-webkit-datetime-edit-hour-field,
  ::-webkit-datetime-edit-day-field,
  ::-webkit-datetime-edit-month-field,
  ::-webkit-datetime-edit-year-field {
    padding: 0;
  }
  ::-webkit-inner-spin-button {
    height: auto;
  }
  [type=search] {
    -webkit-appearance: textfield;
    outline-offset: -2px;
  }
  ::-webkit-search-decoration {
    -webkit-appearance: none;
  }
  ::-webkit-color-swatch-wrapper {
    padding: 0;
  }
  ::file-selector-button {
    font: inherit;
    -webkit-appearance: button;
  }
  output {
    display: inline-block;
  }
  iframe {
    border: 0;
  }
  summary {
    display: list-item;
    cursor: pointer;
  }
  progress {
    vertical-align: baseline;
  }
  [hidden] {
    display: none !important;
  }
  details {
    display: block;
  }
  summary {
    display: list-item;
  }
  table {
    caption-side: bottom;
    border-collapse: collapse;
  }
  th {
    font-weight: 500;
    text-align: inherit;
    text-align: -webkit-match-parent;
  }
  thead,
  tbody,
  tfoot,
  tr,
  td,
  th {
    border-color: inherit;
    border-style: solid;
    border-width: 0;
  }
  /* Scrollbar */
  @supports (scrollbar-color: auto) {
    * {
      scrollbar-width: thin;
      scrollbar-color: var(--theme-surface-container-highest) var(--theme-surface-container-low);
      scrollbar-gutter: auto;
    }
  }
  @supports selector(::-webkit-scrollbar) {
    *::-webkit-scrollbar {
      --_scrollbar-size: 10px;
      width: var(--_scrollbar-size);
      height: var(--_scrollbar-size);
    }
    *::-webkit-scrollbar-track {
      background: var(--theme-surface-container-low);
      border-radius: 50px;
    }
    *::-webkit-scrollbar-thumb {
      background-color: var(--theme-surface-container-highest);
      border-radius: 50px;
    }
  }
  /* Works on Chrome, Edge, and Safari */
  *::-webkit-scrollbar {
    --_scrollbar-size: 10px;
    width: var(--_scrollbar-size);
    height: var(--_scrollbar-size);
  }
  *::-webkit-scrollbar-track {
    background: var(--theme-surface-container-low);
    border-radius: 50px;
  }
  *::-webkit-scrollbar-thumb {
    background-color: var(--theme-surface-container-highest);
    border-radius: 50px;
  }
  details summary {
    color: var(--theme-muted-a10);
    list-style: none;
    user-select: none;
  }
  details summary::-webkit-details-marker {
    display: none;
  }
  details[open] {
    background: var(--theme-surface-container);
    padding: 0.5rem;
    border-radius: 12px;
  }
  ::selection {
    background-color: rgba(var(--theme-secondary-rgba), 0.45);
  }
}
/**
 * Converts a hexadecimal color value to its RGB equivalent.
 *
 * @function hexToRgb
 * @param {string} $hex - The hexadecimal color value.
 * @returns {list} A list containing the red, green, and blue components of the color.
 */
/*
* Tonal badges
* Generate badge tonal background colors
*/
/*
* Tonal button
* Generate button tonal states
*/
/*
* Button sizes
* Generate button sizes
*/
/*
* Helper to use media queries with breakpoints
* @author Giancarlos Garza
* @param {Breakpoints} $breakpoints
*/
/*
* Color tones
* Generate colors tones method using color-mix() css function
*/
/*
* RGBA colors
* Generate rgba colors method using @hexToRgb function
*/
/*
* Containers
* Generate container with media queries
*/
/*
* Row
* Generate row
*/
/*
* Columns
* Generate columns mixin
*/
/*
* Grid
* Generate grid columns system
*/
/*
* Spacing
* Generate margin and padding spacing mixins
*/
/*
* Opacity
* Generate opacity mixin
*/
/*
* Radius
* Generate radius mixin
*/
/*
* Properties
*/
@property --gradient-angle {
  syntax: "<angle>";
  initial-value: 0deg;
  inherits: false;
}
@property --color-wheel-radius {
  syntax: "<percentage>";
  initial-value: 15%;
  inherits: false;
}
@property --element-radius {
  syntax: "<length>";
  initial-value: 25px;
  inherits: false;
}
@property --dots-scroll-position {
  syntax: "<length>";
  initial-value: 0px;
  inherits: false;
}
@property --gradient-shape-angle {
  syntax: "<angle>";
  initial-value: 0deg;
  inherits: false;
}
@property --gradient-shape-primary {
  syntax: "<color>";
  initial-value: rgb(56, 43, 240);
  inherits: false;
}
@property --gradient-shape-accent {
  syntax: "<color>";
  initial-value: rgb(200, 27, 212);
  inherits: false;
}
@property --noise-lines {
  syntax: "<length>";
  inherits: false;
  initial-value: 0.0001px;
}
/*
* Gradient border
*/
@layer abstracts.tokens {
  :root {
    /* basic colors */
    --theme-background: #ffffff;
    --theme-on-background: 18, 18, 18;
    /* on background colors */
    --theme-on-primary: #000000;
    --theme-on-primary-inverse: #ffffff;
    --theme-on-primary-container: #ffffff;
    --theme-on-secondary: #000000;
    --theme-on-secondary-inverse: #ffffff;
    /* surfaces base colors */
    --theme-primary-base: #121212;
    --theme-surface-base: #ffffff;
    --theme-secondary-base: #0c8eaf;
    --theme-accent-base: #fda001;
    /* semantic base colors */
    --theme-success-base: #009f42;
    --theme-warning-base: #ffbb14;
    --theme-danger-base: #b41c2b;
    --theme-muted-base: #52595f;
    --theme-tonal-dark-intensity: 80%;
    --theme-tonal-light-intensity: 40%;
    /* default colors */
    --theme-default: var(--theme-surface-a30);
    --theme-default-active: var(--theme-surface-a40);
    /* surface containers colors */
    --theme-surface-container-lowest: var(--theme-background);
    --theme-surface-container-low: var(--theme-surface-a10);
    --theme-surface-container: var(--theme-surface-a20);
    --theme-surface-container-high: var(--theme-surface-a30);
    --theme-surface-container-highest: var(--theme-surface-a40);
    --theme-surface-body-pane: #ffffff;
    --theme-surface-text-field: transparent;
    --theme-surface-tooltip: #212121;
    --theme-surface-kbd: #636367;
    --theme-surface-toast: #212121;
    /* outline colors */
    --theme-outline-button: var(--theme-surface-a60);
    --theme-outline-text-field: var(--theme-surface-a60);
    --theme-outline-surface: #dadce0;
    /* states colors */
    --theme-active: #e4e4e4;
    --theme-disabled: #e9ecef;
    --theme-table-hover: rgba(0, 0, 0, 0.3);
    /* image filters */
    --theme-img-filter-invert: none;
    --theme-img-testimonial-filter: grayscale(1) invert(0);
    --theme-img-testimonial-filter-invert: grayscale(1) invert(1);
    --theme-frosted-glass-bg: rgba(255, 255, 255, 0.5);
    --theme-frosted-glass-backdrop-filter: blur(30px) saturate(100%) contrast(45%) brightness(130%);
    /* font sizes small */
    --fs-sm-100: clamp(0.80rem, calc(0.31rem + 1.97vw), 0.9375rem);
    --fs-sm-200: clamp(0.60rem, calc(0.31rem + 1.97vw), 0.875rem);
    --fs-sm-300: clamp(0.70rem, calc(0.32rem + 1.69vw), 0.8125rem);
    --fs-sm-400: clamp(0.6875rem, calc(0.31rem + 1.97vw), 0.75rem);
    --fs-sm-500: clamp(0.60rem, calc(0.31rem + 1.97vw), 0.6875rem);
    /* font sizes large */
    --fs-100: clamp(1.875rem, calc(0.11rem + 4.66vw), 2.5rem);
    --fs-200: clamp(1.5625rem, calc(0.16rem + 4.06vw), 2rem);
    --fs-300: clamp(1.4063rem, calc(0.21rem + 3.52vw), 1.75rem);
    --fs-400: clamp(1.25rem, calc(0.24rem + 3.06vw), 1.5rem);
    --fs-500: clamp(1rem, calc(0.27rem + 2.64vw), 1.25rem);
    --fs-600: clamp(0.875rem, calc(0.29rem + 2.28vw), 1rem);
    /* font sizes extra large */
    --fs-xl-100: clamp(2rem, calc(0.11rem + 5vw), 3.3rem);
    /* drawer size */
    --theme-nav-drawer-width: 8rem;
    /* variable fonts weights */
    --vfw-400: "wght" 400;
    --vfw-500: "wght" 500;
    --vfw-600: "wght" 600;
    --vfw-700: "wght" 700;
    --vfw-800: "wght" 800;
    /* variable fonts settings */
    --vfs-heading: "wght" 700, "GRAD" 0, "wdth" 125;
    --vfs-heading-bold: "wght" 800, "GRAD" 0, "wdth" 150;
    /* variable icon weights */
    --iw-normal: "FILL" 0, "wght" 500, var(--ie-normal);
    --iw-semi-bold: "FILL" 0, "wght" 700, var(--ie-normal);
    --iw-bold: "FILL" 1, "wght" 700, var(--ie-normal);
    /* variable icon optical size */
    --ie-low: "FILL" 1, "wght" 700, "GRAD" 200, "opsz" 24;
    --ie-normal: "GRAD" 0, "opsz" 48;
    /* shadows */
    --theme-shadow-base: 250 50% 10%;
    --theme-shadow-intensity: 1%;
    --shadow-sm: 0 3px 5px -2px hsl(var(--theme-shadow-base) / calc(var(--theme-shadow-intensity) + 3%)),
    0 7px 14px -5px hsl(var(--theme-shadow-base) / calc(var(--theme-shadow-intensity) + 5%));
    --shadow-md: 0 -1px 3px 0 hsl(var(--theme-shadow-base) / calc(var(--theme-shadow-intensity) + 2%)),
    0 4px 12px -5px hsl(var(--theme-shadow-base) / calc(var(--theme-shadow-intensity) + 5%)),
    0 12px 15px -5px hsl(var(--theme-shadow-base) / calc(var(--theme-shadow-intensity) + 7%));
    --shadow-lg: 0 -2px 5px 0 hsl(var(--theme-shadow-base) / calc(var(--theme-shadow-intensity) + 2%)),
    0 9px 9px -2px hsl(var(--theme-shadow-base) / calc(var(--theme-shadow-intensity) + 5%)),
    0 16px 16px -2px hsl(var(--theme-shadow-base) / calc(var(--theme-shadow-intensity) + 6%));
    --shadow-xl: 0 -1px 2px 0 hsl(var(--theme-shadow-base) / calc(var(--theme-shadow-intensity) + 2%)),
    0 2px 1px -2px hsl(var(--theme-shadow-base) / calc(var(--theme-shadow-intensity) + 3%)),
    0 5px 5px -2px hsl(var(--theme-shadow-base) / calc(var(--theme-shadow-intensity) + 3%)),
    0 10px 10px -2px hsl(var(--theme-shadow-base) / calc(var(--theme-shadow-intensity) + 4%)),
    0 20px 20px -2px hsl(var(--theme-shadow-base) / calc(var(--theme-shadow-intensity) + 5%));
    /* form icons */
    --theme-form-select-icon: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" fill="black" height="24" viewBox="0 -960 960 960" width="24"><path d="M480-345 240-585l56-56 184 184 184-184 56 56-240 240Z"/></svg>');
    --theme-form-checkbox-icon: url('data:image/svg+xml;utf-8,<svg xmlns="http://www.w3.org/2000/svg" fill="white" height="24" viewBox="0 -960 960 960" width="24"><path d="m382-373.218 328.826-328.826q15.956-15.957 37.826-15.957t37.827 15.957q15.956 15.957 15.956 37.827 0 21.869-15.956 37.826l-366.87 366.87Q403.652-243.565 382-243.565t-37.609-15.956l-170.87-170.87q-15.956-15.957-15.739-37.826.217-21.87 16.174-37.827 15.957-15.957 37.827-15.957 21.869 0 37.826 15.957L382-373.218Z"/></svg>');
    --theme-form-radio-icon: url('data:image/svg+xml;utf-8,<svg xmlns="http://www.w3.org/2000/svg" fill="white" height="24" viewBox="0 -960 960 960" width="24"><path d="M480-60.782q-87.522 0-163.906-32.96-76.385-32.96-132.888-89.464-56.504-56.503-89.464-132.888Q60.782-392.478 60.782-480t32.96-163.906q32.96-76.385 89.464-132.888 56.503-56.504 132.888-89.464 76.384-32.96 163.906-32.96t163.906 32.96q76.385 32.96 132.888 89.464 56.504 56.503 89.464 132.888 32.96 76.384 32.96 163.906t-32.96 163.906q-32.96 76.385-89.464 132.888-56.503 56.504-132.888 89.464Q567.522-60.782 480-60.782Z"/></svg>');
    /* surface tones colors */
    /* semantic colors */
    /* primary rgba colors */
  }
  @supports (color: color-mix(in srgb, white, gray)) {
    :root {
      /* surfaces */
      --theme-surface-a0: color-mix(in srgb, var(--theme-primary-base), var(--theme-surface-base) 96%);
      --theme-surface-a10: color-mix(in srgb, var(--theme-primary-base), var(--theme-surface-base) 95%);
      --theme-surface-a20: color-mix(in srgb, var(--theme-primary-base), var(--theme-surface-base) 90%);
      --theme-surface-a30: color-mix(in srgb, var(--theme-primary-base), var(--theme-surface-base) 85%);
      --theme-surface-a40: color-mix(in srgb, var(--theme-primary-base), var(--theme-surface-base) 80%);
      --theme-surface-a50: color-mix(in srgb, var(--theme-primary-base), var(--theme-surface-base) 75%);
      --theme-surface-a60: color-mix(in srgb, var(--theme-primary-base), var(--theme-surface-base) 70%);
      /* surfaces darker */
      --theme-surface-a70: color-mix(in srgb, var(--theme-primary-base), var(--theme-on-primary) 60%);
      --theme-surface-a80: color-mix(in srgb, var(--theme-primary-base), var(--theme-on-primary) 50%);
      --theme-surface-a90: color-mix(in srgb, var(--theme-primary-base), var(--theme-on-primary) 40%);
      /* surfaces states */
      --theme-surface-disabled: color-mix(in srgb, var(--theme-on-primary-container), var(--theme-muted-a10) 20%);
      /* primaries */
      --theme-primary-a10: color-mix(in srgb, var(--theme-primary-base), var(--theme-on-primary) 15%);
      --theme-primary-a20: color-mix(in srgb, var(--theme-primary-base), var(--theme-on-primary) 20%);
      --theme-primary-a30: color-mix(in srgb, var(--theme-primary-base), var(--theme-on-primary) 25%);
      /* primaries darker */
      --theme-primary-a90: color-mix(in srgb, var(--theme-primary-base), var(--theme-on-primary) 80%);
      /* primaries states */
      --theme-primary-disabled: color-mix(in srgb, var(--theme-primary-base), var(--theme-muted-a10) 50%);
      /* secondaries */
      --theme-secondary-a10: color-mix(in srgb, var(--theme-secondary-base), var(--theme-on-primary) 5%);
      --theme-secondary-a20: color-mix(in srgb, var(--theme-secondary-base), var(--theme-on-primary) 10%);
      --theme-secondary-a30: color-mix(in srgb, var(--theme-secondary-base), var(--theme-on-primary) 15%);
      /* secondaries darker */
      --theme-secondary-a90: color-mix(in srgb, var(--theme-secondary-base), var(--theme-on-primary) 80%);
      /* accents */
      --theme-accent-a10: color-mix(in srgb, var(--theme-accent-base), var(--theme-on-primary) 5%);
      --theme-accent-a20: color-mix(in srgb, var(--theme-accent-base), var(--theme-on-primary) 10%);
      --theme-accent-a30: color-mix(in srgb, var(--theme-accent-base), var(--theme-on-primary) 15%);
      /* accent darker */
      --theme-accent-a90: color-mix(in srgb, var(--theme-accent-base), var(--theme-on-primary) 80%);
    }
  }
  @supports (color: color-mix(in srgb, white, gray)) {
    :root {
      /* success */
      --theme-success-a10: color-mix(in srgb, var(--theme-success-base), var(--theme-on-primary) 15%);
      --theme-success-a20: color-mix(in srgb, var(--theme-success-base), var(--theme-on-primary) 20%);
      --theme-success-a30: color-mix(in srgb, var(--theme-success-base), var(--theme-on-primary) 25%);
      /* success darker */
      --theme-success-a90: color-mix(in srgb, var(--theme-success-base), var(--theme-on-primary) 80%);
      /* warning */
      --theme-warning-a10: color-mix(in srgb, var(--theme-warning-base), var(--theme-on-primary) 15%);
      --theme-warning-a20: color-mix(in srgb, var(--theme-warning-base), var(--theme-on-primary) 20%);
      --theme-warning-a30: color-mix(in srgb, var(--theme-warning-base), var(--theme-on-primary) 25%);
      /* warning darker */
      --theme-warning-a90: color-mix(in srgb, var(--theme-warning-base), var(--theme-on-primary) 80%);
      /* danger */
      --theme-danger-a10: color-mix(in srgb, var(--theme-danger-base), var(--theme-on-primary) 15%);
      --theme-danger-a20: color-mix(in srgb, var(--theme-danger-base), var(--theme-on-primary) 20%);
      --theme-danger-a30: color-mix(in srgb, var(--theme-danger-base), var(--theme-on-primary) 25%);
      /* danger darker */
      --theme-danger-a90: color-mix(in srgb, var(--theme-danger-base), var(--theme-on-primary) 80%);
      /* muted */
      --theme-muted-a10: color-mix(in srgb, var(--theme-muted-base), var(--theme-on-primary) 15%);
      --theme-muted-a20: color-mix(in srgb, var(--theme-muted-base), var(--theme-on-primary) 20%);
      --theme-muted-a30: color-mix(in srgb, var(--theme-muted-base), var(--theme-on-primary) 25%);
      /* muted darker */
      --theme-muted-a90: color-mix(in srgb, var(--theme-muted-base), var(--theme-on-primary) 80%);
    }
  }
  :root {
    --theme-primary-rgba: 18, 18, 18;
    --theme-secondary-rgba: 12, 142, 175;
    --theme-accent-rgba: 253, 160, 1;
    --theme-overlay-rgba: 0, 0, 0;
    --theme-white-rgba: 255, 255, 255;
    --theme-success-rgba: 0, 198.9, 82.875;
    --theme-info-rgba: 0, 0, 188.7;
    --theme-warning-rgba: 255, 170, 0;
    --theme-danger-rgba: 221.2635, 38.8365, 57.0792;
    --theme-muted-rgba: 82, 89, 95;
  }
  .dark-mode {
    /* basic colors */
    --theme-background: var(--theme-surface-a0);
    --theme-on-background: 255, 255, 255;
    /* on background colors */
    --theme-on-primary: #ffffff;
    --theme-on-primary-inverse: #000000;
    --theme-on-primary-container: #000000;
    --theme-on-secondary: #000000;
    --theme-on-secondary-inverse: #ffffff;
    /* surfaces base colors */
    --theme-primary-base: #ffffff;
    --theme-surface-base: #121212;
    --theme-surface-base-inverse: #ffffff;
    --theme-secondary-base: #a9cedc;
    --theme-accent-base: #ffeccc;
    /* semantic base colors */
    --theme-success-base: #c1ffdb;
    --theme-warning-base: #fbe9c5;
    --theme-danger-base: #f8d4d7;
    --theme-muted-base: #c0c5c9;
    --theme-tonal-dark-intensity: 70%;
    --theme-tonal-light-intensity: 15%;
    /* default colors */
    --theme-default: var(--theme-surface-a30);
    --theme-default-active: #323232;
    /* surface containers colors */
    --theme-surface-container-lowest: var(--theme-background);
    --theme-surface-container-low: var(--theme-surface-a10);
    --theme-surface-container: var(--theme-surface-a20);
    --theme-surface-container-high: var(--theme-surface-a40);
    --theme-surface-container-highest: var(--theme-surface-a50);
    --theme-surface-body-pane: var(--theme-surface-a20);
    --theme-surface-text-field: transparent;
    --theme-surface-tooltip: #3a3a3a;
    --theme-surface-kbd: #c2c2c2;
    --theme-surface-toast: var(--theme-surface-a70);
    /* outline colors */
    --theme-outline-button: var(--theme-surface-a60);
    --theme-outline-text-field: var(--theme-surface-a60);
    --theme-outline-surface: var(--theme-surface-a60);
    /* states colors */
    --theme-active: #333333;
    --theme-disabled: #939393;
    --theme-table-hover: rgba(255, 255, 255, 0.1);
    /* image filters */
    --theme-img-filter-invert: brightness(0) invert(1);
    --theme-img-testimonial-filter: grayscale(1) invert(1);
    --theme-img-testimonial-filter-invert: grayscale(1) invert(0);
    --theme-frosted-glass-bg: rgba(0, 0, 0, 0.50);
    --theme-frosted-glass-backdrop-filter: blur(20px) saturate(150%) contrast(100%) brightness(100%);
    /* shadows */
    --theme-shadow-base: 0 0% 0%;
    /* form icons */
    --theme-form-select-icon: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" fill="white" height="24" viewBox="0 -960 960 960" width="24"><path d="M480-345 240-585l56-56 184 184 184-184 56 56-240 240Z"/></svg>');
    --theme-form-checkbox-icon: url('data:image/svg+xml;utf-8,<svg xmlns="http://www.w3.org/2000/svg" fill="black" height="24" viewBox="0 -960 960 960" width="24"><path d="m382-373.218 328.826-328.826q15.956-15.957 37.826-15.957t37.827 15.957q15.956 15.957 15.956 37.827 0 21.869-15.956 37.826l-366.87 366.87Q403.652-243.565 382-243.565t-37.609-15.956l-170.87-170.87q-15.956-15.957-15.739-37.826.217-21.87 16.174-37.827 15.957-15.957 37.827-15.957 21.869 0 37.826 15.957L382-373.218Z"/></svg>');
    --theme-form-radio-icon: url('data:image/svg+xml;utf-8,<svg xmlns="http://www.w3.org/2000/svg" fill="black" height="24" viewBox="0 -960 960 960" width="24"><path d="M480-60.782q-87.522 0-163.906-32.96-76.385-32.96-132.888-89.464-56.504-56.503-89.464-132.888Q60.782-392.478 60.782-480t32.96-163.906q32.96-76.385 89.464-132.888 56.503-56.504 132.888-89.464 76.384-32.96 163.906-32.96t163.906 32.96q76.385 32.96 132.888 89.464 56.504 56.503 89.464 132.888 32.96 76.384 32.96 163.906t-32.96 163.906q-32.96 76.385-89.464 132.888-56.503 56.504-132.888 89.464Q567.522-60.782 480-60.782Z"/></svg>');
    /* surface tones colors */
    /* semantic colors */
  }
  @supports (color: color-mix(in srgb, black, gray)) {
    .dark-mode {
      /* surfaces */
      --theme-surface-a0: color-mix(in srgb, var(--theme-primary-base), var(--theme-surface-base) 96%);
      --theme-surface-a10: color-mix(in srgb, var(--theme-primary-base), var(--theme-surface-base) 95%);
      --theme-surface-a20: color-mix(in srgb, var(--theme-primary-base), var(--theme-surface-base) 90%);
      --theme-surface-a30: color-mix(in srgb, var(--theme-primary-base), var(--theme-surface-base) 85%);
      --theme-surface-a40: color-mix(in srgb, var(--theme-primary-base), var(--theme-surface-base) 80%);
      --theme-surface-a50: color-mix(in srgb, var(--theme-primary-base), var(--theme-surface-base) 75%);
      --theme-surface-a60: color-mix(in srgb, var(--theme-primary-base), var(--theme-surface-base) 70%);
      /* surfaces lighter */
      --theme-surface-a70: color-mix(in srgb, var(--theme-primary-base), var(--theme-surface-base-inverse) 60%);
      --theme-surface-a80: color-mix(in srgb, var(--theme-primary-base), var(--theme-surface-base-inverse) 50%);
      --theme-surface-a90: color-mix(in srgb, var(--theme-primary-base), var(--theme-surface-base-inverse) 40%);
      /* surfaces states */
      --theme-surface-disabled: color-mix(in srgb, var(--theme-on-primary-container), var(--theme-muted-a10) 30%);
      /* primaries */
      --theme-primary-a10: color-mix(in srgb, var(--theme-primary-base), var(--theme-on-primary-inverse) 5%);
      --theme-primary-a20: color-mix(in srgb, var(--theme-primary-base), var(--theme-on-primary-inverse) 10%);
      --theme-primary-a30: color-mix(in srgb, var(--theme-primary-base), var(--theme-on-primary-inverse) 15%);
      /* primaries lighter */
      --theme-primary-a90: color-mix(in srgb, var(--theme-primary-base), var(--theme-on-primary) 50%);
      /* primaries states */
      --theme-primary-disabled: color-mix(in srgb, var(--theme-primary-base), var(--theme-muted-a10) 50%);
      /* secondaries */
      --theme-secondary-a10: color-mix(in srgb, var(--theme-secondary-base), var(--theme-on-primary-inverse) 5%);
      --theme-secondary-a20: color-mix(in srgb, var(--theme-secondary-base), var(--theme-on-primary-inverse) 10%);
      --theme-secondary-a30: color-mix(in srgb, var(--theme-secondary-base), var(--theme-on-primary-inverse) 15%);
      /* secondaries lighter */
      --theme-secondary-a90: color-mix(in srgb, var(--theme-secondary-base), var(--theme-on-primary) 50%);
      /* accents */
      --theme-accent-a10: color-mix(in srgb, var(--theme-accent-base), var(--theme-on-primary-inverse) 5%);
      --theme-accent-a20: color-mix(in srgb, var(--theme-accent-base), var(--theme-on-primary-inverse) 10%);
      --theme-accent-a30: color-mix(in srgb, var(--theme-accent-base), var(--theme-on-primary-inverse) 15%);
      /* accent lighter */
      --theme-accent-a90: color-mix(in srgb, var(--theme-accent-base), var(--theme-on-primary) 50%);
    }
  }
  @supports (color: color-mix(in srgb, black, gray)) {
    .dark-mode {
      /* success */
      --theme-success-a10: color-mix(in srgb, var(--theme-success-base), var(--theme-on-primary) 5%);
      --theme-success-a20: color-mix(in srgb, var(--theme-success-base), var(--theme-on-primary) 10%);
      --theme-success-a30: color-mix(in srgb, var(--theme-success-base), var(--theme-on-primary) 15%);
      /* success lighter */
      --theme-success-a90: color-mix(in srgb, var(--theme-success-base), var(--theme-on-primary) 50%);
      /* warning */
      --theme-warning-a10: color-mix(in srgb, var(--theme-warning-base), var(--theme-on-primary) 5%);
      --theme-warning-a20: color-mix(in srgb, var(--theme-warning-base), var(--theme-on-primary) 10%);
      --theme-warning-a30: color-mix(in srgb, var(--theme-warning-base), var(--theme-on-primary) 15%);
      /* warning lighter */
      --theme-warning-a90: color-mix(in srgb, var(--theme-warning-base), var(--theme-on-primary) 50%);
      /* danger */
      --theme-danger-a10: color-mix(in srgb, var(--theme-danger-base), var(--theme-on-primary) 5%);
      --theme-danger-a20: color-mix(in srgb, var(--theme-danger-base), var(--theme-on-primary) 10%);
      --theme-danger-a30: color-mix(in srgb, var(--theme-danger-base), var(--theme-on-primary) 15%);
      /* danger lighter */
      --theme-danger-a90: color-mix(in srgb, var(--theme-danger-base), var(--theme-on-primary) 50%);
      /* muted */
      --theme-muted-a10: color-mix(in srgb, var(--theme-muted-base), var(--theme-on-primary) 5%);
      --theme-muted-a20: color-mix(in srgb, var(--theme-muted-base), var(--theme-on-primary) 10%);
      --theme-muted-a30: color-mix(in srgb, var(--theme-muted-base), var(--theme-on-primary) 15%);
      /* muted lighter */
      --theme-muted-a90: color-mix(in srgb, var(--theme-muted-base), var(--theme-on-primary) 50%);
    }
  }
}
@layer base.animations {
  /*
   * Animations
   * Fade
   */
  @keyframes fade-in-down {
    0% {
      translate: 0 2rem;
      opacity: 0;
    }
    100% {
      translate: 0;
      opacity: 1;
    }
  }
  @keyframes fade-in-left {
    0% {
      translate: 2rem 0;
      opacity: 0;
    }
    100% {
      translate: 0;
      opacity: 1;
    }
  }
  /*
   * Animations
   * Opacity
   */
  @keyframes opacity-in {
    0% {
      opacity: 0;
    }
    100% {
      opacity: 1;
    }
  }
  /*
   * Animations
   * Scale
   */
  @keyframes scale-in {
    0% {
      scale: 0;
      opacity: 0;
    }
    100% {
      scale: 1;
      opacity: 1;
    }
  }
  /*
  * Animations
  * Slide
  */
  @keyframes slide-in-down {
    0% {
      translate: 0 2rem;
    }
    100% {
      translate: 0;
    }
  }
  /*
   * Animations
   * Spin
   */
  @keyframes spin {
    to {
      rotate: 1turn;
    }
  }
  .animation-spin {
    animation-name: spin;
    animation-direction: normal;
    animation-duration: 1s;
    animation-fill-mode: forwards;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
  }
  /*
   * Animations
   * Misc
   */
  @keyframes spin-wheel {
    to {
      --color-wheel-radius: 50%;
      rotate: 360deg;
    }
  }
  @keyframes pulse {
    0% {
      scale: 0.9;
    }
    50% {
      scale: 1;
    }
    100% {
      scale: 0.9;
    }
  }
  @keyframes glitch {
    0% {
      translate: 0;
    }
    20% {
      translate: -5px 5px;
    }
    40% {
      translate: -5px -5px;
    }
    60% {
      translate: 5px 5px;
    }
    80% {
      translate: 5px -5px;
    }
    to {
      translate: 0;
    }
  }
  @keyframes shake-x {
    0%, 100% {
      translate: 0;
    }
    20% {
      translate: -5%;
    }
    40% {
      translate: 5%;
    }
    60% {
      translate: -5%;
    }
    80% {
      translate: 5%;
    }
  }
  @keyframes shake-y {
    0%, 100% {
      translate: 0 0;
    }
    20% {
      translate: 0 -5%;
    }
    40% {
      translate: 0 5%;
    }
    60% {
      translate: 0 -5%;
    }
    80% {
      translate: 0 5%;
    }
  }
  @keyframes zoom-in-out {
    from {
      scale: inherit;
    }
    50% {
      scale: 1.1;
    }
    to {
      scale: inherit;
    }
  }
  @keyframes progress-bar-stripes {
    from {
      width: 0;
    }
    to {
      width: 100%;
    }
  }
  @keyframes animate-wheel {
    from {
      --_scheme-offset: 1.5rem;
      --_scheme-col-size: 0.938rem;
      rotate: 0deg;
    }
    to {
      --_scheme-offset: 2.25rem;
      --_scheme-col-size: 0.938rem;
      rotate: 360deg;
    }
  }
  @keyframes angle-spin {
    0% {
      --gradient-angle: 0deg;
    }
    100% {
      --gradient-angle: 360deg;
    }
  }
  @keyframes shine-light {
    to {
      --_shine-left: 115%;
    }
  }
  @keyframes dots-scroll {
    from {
      --dots-scroll-position: 250px;
    }
    to {
      --dots-scroll-position: 0;
    }
  }
  @keyframes animate-gradient-shape-1 {
    from {
      --gradient-shape-primary: initial;
      --gradient-shape-angle: 0deg;
    }
    50% {
      --gradient-shape-primary: rgba(42, 32, 180, 1);
    }
    to {
      --gradient-shape-accent: initial;
      --gradient-shape-angle: 360deg;
    }
  }
  @keyframes animate-gradient-shape-2 {
    from {
      --gradient-shape-accent: initial;
      --gradient-shape-angle: 0deg;
    }
    50% {
      --gradient-shape-accent: rgba(102, 0, 255, 1) ;
    }
    to {
      --gradient-shape-accent: initial;
      --gradient-shape-angle: 360deg;
    }
  }
  /*
   * Animations
   * Prefers reduced motion
   */
  @media (prefers-reduced-motion) {
    @keyframes fade-in-down {
      0% {
        translate: 0;
        opacity: 0;
      }
      100% {
        translate: 0;
        opacity: 1;
      }
    }
    @keyframes fade-in-left {
      0% {
        translate: 0;
        opacity: 0;
      }
      100% {
        translate: 0;
        opacity: 1;
      }
    }
    @keyframes scale-in {
      0% {
        scale: 1;
        opacity: 0;
      }
      100% {
        scale: 1;
        opacity: 1;
      }
    }
  }
  /*
  * Transitions
  * Nuxt pages
  */
  .page-enter-active,
  .page-leave-active,
  .layout-enter-active,
  .layout-leave-active {
    transition: opacity ease 0.2s;
  }
  .page-enter,
  .page-leave-to,
  .layout-enter,
  .layout-leave-to {
    opacity: 0;
  }
  .slide-enter-active {
    --_slide-easing-in: cubic-bezier(0.05, 0.7, 0.1, 1);
    overflow-x: clip;
    transition: opacity 600ms var(--_slide-easing-in), translate 800ms var(--_slide-easing-in);
  }
  @supports (transition: all 100ms linear(1, 1, 1)) {
    .slide-enter-active {
      --_slide-easing-in: linear(0, 0.00245 1.753%, 0.00994 3.55%, 0.01966 4.916%, 0.03415 6.402%, 0.05334 7.836%, 0.07376 9.061%, 0.10031 10.32%, 0.12808 11.414%, 0.19399 13.366%, 0.27138 14.974%, 0.34403 16.052%, 0.47679 17.475%, 0.54434 18.338%, 0.60689 19.389%, 0.66036 20.609%, 0.71671 22.4%, 0.76532 24.589%, 0.78755 25.874%, 0.80828 27.285%, 0.84475 30.42%, 0.86492 32.632%, 0.88332 35.056%, 0.9002 37.721%, 0.91554 40.622%, 0.9295 43.795%, 0.94208 47.239%, 0.95333 50.97%, 0.96327 54.986%, 0.9795 64.011%, 0.99095 74.434%, 0.99774 86.373%, 1);
    }
  }
  .slide-leave-active {
    --_slide-easing-out: cubic-bezier(0.4, 0, 1, 1);
    transition: opacity 200ms var(--_slide-easing-out), translate 300ms var(--_slide-easing-out);
    overflow-x: clip;
  }
  .slide-enter-from,
  .slide-leave-to {
    opacity: 0;
    translate: 1.5rem 0;
  }
  /*
  * Transitions
  * Vue
  */
  .table-move,
  .table-enter-active,
  .table-leave-active {
    transition: all 0.5s ease;
  }
  .table-enter-from,
  .table-leave-to {
    opacity: 0;
    translate: 0 30px;
  }
  /* Ensure leaving items are taken out of layout flow so that moving
     animations can be calculated correctly. */
  .table-leave-active {
    position: absolute;
  }
  /*
    Table td enter and leave
    fade transition when isExpanding toggle
  */
  .table-td-fade-enter-active {
    transition: all 0.5s ease-out;
  }
  .table-td-fade-leave-active {
    transition: all 0.2s cubic-bezier(1, 0.5, 0.8, 1);
  }
  .table-td-fade-enter-from,
  .table-td-fade-leave-to {
    translate: -20px;
    opacity: 0;
  }
  /*
    Slide enter and leave
    transition for tab menu changes
  */
  .slide-inline-enter-active {
    --_slide-inline-easing-in: cubic-bezier(0.05, 0.7, 0.1, 1);
    transition: translate 600ms var(--_slide-inline-easing-in), opacity 600ms var(--_slide-inline-easing-in);
  }
  @supports (transition: all 100ms linear(1, 1, 1)) {
    .slide-inline-enter-active {
      --_slide-inline-easing-in: linear(0, 0.00245 1.753%, 0.00994 3.55%, 0.01966 4.916%, 0.03415 6.402%, 0.05334 7.836%, 0.07376 9.061%, 0.10031 10.32%, 0.12808 11.414%, 0.19399 13.366%, 0.27138 14.974%, 0.34403 16.052%, 0.47679 17.475%, 0.54434 18.338%, 0.60689 19.389%, 0.66036 20.609%, 0.71671 22.4%, 0.76532 24.589%, 0.78755 25.874%, 0.80828 27.285%, 0.84475 30.42%, 0.86492 32.632%, 0.88332 35.056%, 0.9002 37.721%, 0.91554 40.622%, 0.9295 43.795%, 0.94208 47.239%, 0.95333 50.97%, 0.96327 54.986%, 0.9795 64.011%, 0.99095 74.434%, 0.99774 86.373%, 1);
    }
  }
  .slide-inline-leave-active {
    --_slide-inline-easing-out: cubic-bezier(0.4, 0, 1, 1);
    transition: translate 300ms var(--_slide-inline-easing-out), opacity 300ms var(--_slide-inline-easing-out);
  }
  @supports (transition: all 100ms linear(1, 1, 1)) {
    .slide-inline-leave-active {
      --_slide-inline-easing-out: linear(0, 0.00245 1.753%, 0.00994 3.55%, 0.01966 4.916%, 0.03415 6.402%, 0.05334 7.836%, 0.07376 9.061%, 0.10031 10.32%, 0.12808 11.414%, 0.19399 13.366%, 0.27138 14.974%, 0.34403 16.052%, 0.47679 17.475%, 0.54434 18.338%, 0.60689 19.389%, 0.66036 20.609%, 0.71671 22.4%, 0.76532 24.589%, 0.78755 25.874%, 0.80828 27.285%, 0.84475 30.42%, 0.86492 32.632%, 0.88332 35.056%, 0.9002 37.721%, 0.91554 40.622%, 0.9295 43.795%, 0.94208 47.239%, 0.95333 50.97%, 0.96327 54.986%, 0.9795 64.011%, 0.99095 74.434%, 0.99774 86.373%, 1);
    }
  }
  .slide-inline-enter-from {
    opacity: 0;
    translate: 2rem 0;
  }
  .slide-inline-leave-to {
    opacity: 0;
    translate: -2rem 0;
  }
  /*
    Slide enter and leave
    vertical transition
  */
  .slide-block-enter-active {
    transition: translate 800ms cubic-bezier(0.05, 0.7, 0.1, 1), opacity 400ms cubic-bezier(0.05, 0.7, 0.1, 1);
  }
  .slide-block-leave-active {
    transition: translate 400ms cubic-bezier(0.4, 0, 1, 1), opacity 200ms cubic-bezier(0.4, 0, 1, 1);
  }
  .slide-block-enter-from {
    opacity: 0;
    translate: 0 1.875rem;
  }
  .slide-block-leave-to {
    opacity: 0;
    translate: 0 -1.875rem;
  }
}
/* https://fonts.googleapis.com/css2?family=Geist:wght@200..800&family=Mona+Sans:wght@200..800&display=swap */
/* latin-ext */
@font-face {
  font-family: "Geist";
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url("../fonts/Geist-200_800-1.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: "Geist";
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url("../fonts/Geist-200_800-2.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* vietnamese */
@font-face {
  font-family: "Mona Sans";
  font-style: normal;
  font-weight: 200 800;
  font-stretch: 100%;
  font-display: swap;
  src: url("../fonts/Mona_Sans-200_800-3.woff2") format("woff2");
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: "Mona Sans";
  font-style: normal;
  font-weight: 200 800;
  font-stretch: 100%;
  font-display: swap;
  src: url("../fonts/Mona_Sans-200_800-4.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: "Mona Sans";
  font-style: normal;
  font-weight: 200 800;
  font-stretch: 100%;
  font-display: swap;
  src: url("../fonts/Mona_Sans-200_800-5.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@layer base.icons {
  i:is(.material-symbols-sharp) {
    vertical-align: middle;
    display: inline-flex;
  }
  i:is(.material-symbols-sharp) {
    transition: all 0.3s cubic-bezier(0.05, 0.7, 0.1, 1);
    font-variation-settings: var(--iw-semi-bold);
  }
  .icon-wrap {
    padding: 20px;
    background-color: var(--theme-background);
    color: var(--theme-primary-a10);
    border-radius: 50px;
    box-shadow: none;
  }
  .icon-wrap.icon-wrap-primary {
    background-color: rgba(var(--theme-primary-rgba), 10%);
    color: var(--theme-primary-a10);
    box-shadow: none;
  }
  .icon-wrap.icon-wrap-success {
    background-color: rgba(var(--theme-success-rgba), 10%);
    color: var(--theme-success-a10);
    box-shadow: none;
  }
  .icon-wrap.icon-wrap-default {
    background-color: var(--theme-surface-container);
    color: var(--theme-on-primary);
    box-shadow: none;
  }
  .icon-wrap.icon-wrap-outline {
    background-color: transparent;
    color: var(--theme-on-primary);
    box-shadow: none;
    border: 1px solid var(--theme-outline-surface);
  }
  .icon-wrap.icon-wrap-surface {
    background-color: var(--theme-surface-body-pane);
    color: var(--theme-on-primary);
    box-shadow: none;
  }
  .icon-wrap.icon-wrap-sm {
    padding: 10px;
    border-radius: 12px;
  }
  .icon-wrap.icon-wrap-gradient {
    color: hsl(100, 100%, 100%);
    box-shadow: none;
    background: -webkit-linear-gradient(45deg, #0023f7, #382bf0);
    background: linear-gradient(45deg, #0023f7, #382bf0);
  }
  .icon-wrap.icon-wrap-gradient.g-primary {
    --_badge-gradient-color: hsl(100, 100%, 100%);
    background: -webkit-linear-gradient(45deg, #0023f7, #382bf0);
    background: linear-gradient(45deg, #0023f7, #382bf0);
  }
  .icon-wrap.icon-wrap-gradient.g-gold {
    background: -webkit-linear-gradient(45deg, #875919, #a87732, #dbaa64, #f0c588);
    background: linear-gradient(45deg, #875919, #a87732, #dbaa64, #f0c588);
  }
  .icon-wrap.icon-wrap-gradient.g-green {
    background: -webkit-linear-gradient(45deg, #4ae17b, #11d181);
    background: linear-gradient(45deg, #4ae17b, #11d181);
  }
  .icon-wrap.icon-wrap-gradient.g-cyan {
    background: -webkit-linear-gradient(45deg, #0adeff, #0a81ff);
    background: linear-gradient(45deg, #0adeff, #0a81ff);
  }
  .icon-wrap.icon-wrap-gradient.g-yellow {
    background: -webkit-linear-gradient(45deg, #ffe572, #c28333);
    background: linear-gradient(45deg, #ffe572, #c28333);
  }
  .icon-wrap.icon-wrap-gradient.g-orange {
    background: -webkit-linear-gradient(45deg, #c20ea1, #dd2d7f, #ee4c5e, #f46d41);
    background: linear-gradient(45deg, #c20ea1, #dd2d7f, #ee4c5e, #f46d41);
  }
  .icon-wrap.icon-wrap-gradient.g-purple {
    background: -webkit-linear-gradient(45deg, #c11ceb, #6f19b5, #25007a);
    background: linear-gradient(45deg, #c11ceb, #6f19b5, #25007a);
  }
  .icon-wrap.icon-wrap-gradient.g-red {
    background: -webkit-linear-gradient(45deg, #e91e63, #d81557, #aa1145);
    background: linear-gradient(45deg, #e91e63, #d81557, #aa1145);
  }
  .icon-wrap.icon-wrap-gradient.g-blue {
    background: -webkit-linear-gradient(45deg, #148ade, #116ab8);
    background: linear-gradient(45deg, #148ade, #116ab8);
  }
  .icon-wrap.icon-wrap-gradient.g-black {
    background: -webkit-linear-gradient(45deg, #404040, #212121);
    background: linear-gradient(45deg, #404040, #212121);
  }
  .icon-wrap.icon-wrap-gradient.g-indigo {
    background: -webkit-linear-gradient(45deg, #715cff, #6851ff);
    background: linear-gradient(45deg, #715cff, #6851ff);
  }
  .icon-wrap.icon-wrap-gradient.g-violet {
    background: -webkit-linear-gradient(45deg, #8200e7, #bf3eff);
    background: linear-gradient(45deg, #8200e7, #bf3eff);
  }
  .icon-wrap.icon-wrap-gradient.g-body-primary {
    background-image: linear-gradient(0deg, var(--theme-on-primary), #382bf0);
    background-image: -webkit-linear-gradient(0deg, var(--theme-on-primary), #382bf0);
  }
  .icon-wrap.icon-wrap-gradient.g-body-secondary {
    background-image: linear-gradient(45deg, var(--theme-on-primary), #ffc107);
    background-image: -webkit-linear-gradient(45deg, var(--theme-on-primary), #ffc107);
  }
  .icon-wrap.icon-wrap-gradient.g-body-success {
    background-image: linear-gradient(0deg, var(--theme-on-primary), #009f42);
    background-image: -webkit-linear-gradient(0deg, var(--theme-on-primary), #009f42);
  }
  .icon-wrap.icon-wrap-gradient.g-body-danger {
    background-image: linear-gradient(45deg, var(--theme-on-primary), #b41c2b);
    background-image: -webkit-linear-gradient(45deg, var(--theme-on-primary), #b41c2b);
  }
  .icon-wrap.icon-wrap-gradient i {
    font-variation-settings: var(--iw-bold);
    color: inherit;
  }
  .icon-state-wrapper {
    --_icon-state-size: clamp(3rem, calc(5vw + 3rem), 7rem);
    --_icon-state-gap: 1rem;
    container: state-wrapper/inline-size;
    display: grid;
    justify-content: center;
    margin-block: 1.75rem;
    gap: var(--_icon-state-gap);
    isolation: isolate;
  }
  .icon-state-wrapper > * {
    grid-area: 1/1;
  }
  .icon-state-wrapper:is(:hover) .icon-empty-state {
    --_icon-rotate: 15deg;
    --_icon-translate: 10px;
    --_icon-state-radius: 25px;
  }
  .icon-state-wrapper .icon-empty-state {
    --_icon-rotate: 0;
    --_icon-translate: 5px;
    --_icon-translate-pow: 5;
    --_icon-state-radius: 100%;
    --_icon-state-easing-in: cubic-bezier(0.05, 0.7, 0.1, 1);
    --_icon-state-easing-duration: 250ms;
    height: var(--_icon-state-size);
    width: var(--_icon-state-size);
    aspect-ratio: 1;
    border-radius: var(--_icon-state-radius);
    transform-origin: center bottom;
    transition: translate var(--_icon-state-easing-duration) var(--_icon-state-easing-in), rotate var(--_icon-state-easing-duration) var(--_icon-state-easing-in), border-radius var(--_icon-state-easing-duration) var(--_icon-state-easing-in);
  }
  .icon-state-wrapper .icon-empty-state:nth-child(1) {
    background: -webkit-linear-gradient(45deg, #0adeff, #0a81ff);
    background: linear-gradient(45deg, #0adeff, #0a81ff);
    rotate: calc(var(--_icon-rotate) * -2);
    translate: calc(var(--_icon-translate) * var(--_icon-translate-pow) * -1);
  }
  .icon-state-wrapper .icon-empty-state:nth-child(2) {
    background: -webkit-linear-gradient(45deg, #ffe572, #c28333);
    background: linear-gradient(45deg, #ffe572, #c28333);
    rotate: calc(var(--_icon-rotate) * 0);
    translate: calc(var(--_icon-translate) * 0);
  }
  .icon-state-wrapper .icon-empty-state:nth-child(3) {
    background: -webkit-linear-gradient(45deg, #8200e7, #bf3eff);
    background: linear-gradient(45deg, #8200e7, #bf3eff);
    rotate: calc(var(--_icon-rotate) * 2);
    translate: calc(var(--_icon-translate) * var(--_icon-translate-pow));
  }
  @container state-wrapper (width <= 500px) {
    .icon-state-wrapper .icon-empty-state {
      --_icon-translate: 5px;
      --_icon-translate-pow: 2.5;
    }
  }
  @supports (transition: linear(1, 1, 1)) {
    .icon-state-wrapper .icon-empty-state {
      --_icon-state-easing-in: linear(0, 0.00217 0.5%, 0.00866 1.01%, 0.0346 2.07%, 0.0782 3.2%, 0.14066 4.43%, 0.28086 6.651%, 0.72289 12.911%, 0.84164 14.861%, 0.93834 16.722%, 1.01676 18.572%, 1.07743 20.432%, 1.12131 22.332%, 1.1373 23.312%, 1.14934 24.312%, 1.15904 25.603%, 1.16294 26.953%, 1.16113 28.383%, 1.15356 29.933%, 1.14335 31.273%, 1.12887 32.783%, 1.05059 39.614%, 1.01677 43.094%, 1.00206, 0.99057 46.975%, 0.98215 48.945%, 0.9766 50.995%, 0.9735 53.835%, 0.97488 57.056%, 0.9966 69.827%, 1.00329 76.878%, 1.00417 83.808%, 0.99996);
      --_icon-state-easing-duration: 800ms;
    }
  }
}
@layer base.table {
  /*
   * Responsive table
   */
  .table-responsive {
    display: block;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .table-responsive::-webkit-scrollbar {
    display: none;
  }
  /*
   * Table
   */
  .table {
    --_table-bg-color: var(--theme-surface-container);
    --_table-color: var(--theme-on-primary);
    --_table-border-color: var(--theme-outline-surface);
    --_table-border-width: 1px;
    --_table-gutter-x: 0.55rem;
    --_table-gutter-y: 0.55rem;
    --_table-font-size: 12px;
    display: table;
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
    font-size: var(--_table-font-size);
  }
  .table thead tr th {
    font-size: var(--fs-sm-500);
    font-weight: 600;
    font-family: "Geist", "Roboto", -apple-system, "Segoe UI", sans-serif;
    letter-spacing: 0.0727em;
    text-align: start;
    padding: var(--_table-gutter-x) var(--_table-gutter-y);
    vertical-align: middle;
    border-top: var(--_table-border-width) solid var(--theme-outline-surface);
  }
  .table tbody td {
    font-size: var(--_table-font-size);
    line-height: 1.5;
    border-top: var(--_table-border-width) solid var(--theme-outline-surface);
    padding-inline: var(--_table-gutter-x);
    padding-block: var(--_table-gutter-y);
    vertical-align: middle;
    text-wrap: balance;
  }
  @supports (text-wrap: pretty) {
    .table tbody td {
      text-wrap: pretty;
    }
  }
  .table tbody td .td-text {
    font-size: 12px;
  }
  .table tbody td .td-name {
    display: inline-flex;
    gap: 0.45rem;
    align-items: center;
  }
  .table tbody td .td-name i {
    font-variation-settings: var(--iw-semi-bold);
    color: var(--theme-muted-a10);
    font-size: 20px;
  }
  .table tbody td .td-name i:is(.text-gradient) {
    font-variation-settings: var(--iw-bold);
  }
  .table tbody td.td-actions .btn {
    margin-right: 0.35rem;
  }
  .table.table-bordered :where(thead > tr > th) {
    border-color: var(--theme-outline-surface);
    border-style: solid;
    border-width: var(--_table-border-width);
  }
  .table.table-bordered :where(tbody > tr > td) {
    border-color: var(--theme-outline-surface);
    border-style: solid;
    border-width: var(--_table-border-width);
  }
  .table.table-borderless th, .table.table-borderless td {
    border: var(--_table-border-width) solid transparent;
  }
  .table.table-striped tbody tr:nth-child(odd) {
    background-color: var(--theme-surface-container);
  }
  .table.table-hover tbody tr {
    transition: background-color 100ms ease-in-out;
  }
  .table.table-hover tbody tr:is(:hover) {
    background-color: var(--theme-surface-a10);
  }
  .table.table-colors tbody td {
    user-select: all;
    cursor: pointer;
  }
  .table.table-pricing {
    --_table-pricing-pro-opacity: 0.15;
  }
  .table.table-pricing thead {
    position: sticky;
    top: 4rem;
    padding: 1rem;
    background-color: var(--theme-surface-body-pane);
  }
  .table.table-pricing thead tr td {
    padding: var(--_table-gutter-x);
    background-color: var(--theme-surface-container-low);
  }
  .table.table-pricing thead tr td:is(.font-secondary) {
    font-size: var(--fs-500);
    font-weight: 800;
    line-height: 2;
  }
  .table.table-pricing thead tr > :nth-child(3) {
    background-color: rgba(var(--theme-success-rgba), var(--_table-pricing-pro-opacity));
  }
  .table.table-pricing tbody tr td:not(.font-secondary) {
    color: var(--theme-muted-a10);
  }
  .table.table-pricing tbody tr td:is(.font-secondary) {
    font-size: var(--fs-500);
    font-weight: 800;
    line-height: 2;
  }
  .table.table-pricing tbody tr > :nth-child(3) {
    background-color: rgba(var(--theme-success-rgba), var(--_table-pricing-pro-opacity));
  }
  .table.table-sm {
    --_table-gutter-x: 0.25rem;
    --_table-gutter-y: 0.25rem;
  }
}
@layer base.typography {
  h1,
  h2,
  h3,
  h4,
  h5,
  h6 {
    margin-top: 0;
    margin-bottom: 0.5rem;
    font-weight: 500;
    font-style: normal;
    line-height: 1.2;
    color: var(--theme-on-primary);
  }
  h1 {
    font-family: "Geist", "Roboto", -apple-system, "Segoe UI", sans-serif;
    font-weight: 600;
    font-size: var(--fs-100);
    letter-spacing: 0px;
  }
  h2 {
    font-family: "Geist", "Roboto", -apple-system, "Segoe UI", sans-serif;
    font-weight: 400;
    font-size: var(--fs-200);
    letter-spacing: 0px;
  }
  h3 {
    font-family: "Geist", "Roboto", -apple-system, "Segoe UI", sans-serif;
    font-weight: 500;
    font-size: var(--fs-300);
    letter-spacing: 0px;
  }
  h4 {
    font-family: "Mona Sans", "Roboto", -apple-system, "Segoe UI", sans-serif;
    font-weight: 500;
    font-size: var(--fs-400);
    letter-spacing: 0.25px;
  }
  h5 {
    font-family: "Mona Sans", "Roboto", -apple-system, "Segoe UI", sans-serif;
    font-weight: 500;
    font-size: var(--fs-500);
    letter-spacing: 0.2px;
  }
  h6 {
    font-family: "Mona Sans", "Roboto", -apple-system, "Segoe UI", sans-serif;
    font-weight: 500;
    font-size: var(--fs-600);
    letter-spacing: 0.15px;
  }
  .subtitle-1, .nav-pill-controls .nav-pill-item .nav-pill-link {
    font-family: "Mona Sans", "Roboto", -apple-system, "Segoe UI", sans-serif;
    font-weight: 400;
    font-size: var(--fs-sm-100);
    letter-spacing: 0.45px;
  }
  .subtitle-2, .accordion-group .accordion .accordion-body p {
    font-family: "Mona Sans", "Roboto", -apple-system, "Segoe UI", sans-serif;
    font-weight: 400;
    font-size: var(--fs-sm-300);
    letter-spacing: 0.35px;
  }
  .body-1 {
    font-family: "Mona Sans", "Roboto", -apple-system, "Segoe UI", sans-serif;
    font-weight: 400;
    font-size: var(--fs-600);
    letter-spacing: 0.5px;
    line-height: 1.5;
  }
  .caption {
    font-family: "Mona Sans", "Roboto", -apple-system, "Segoe UI", sans-serif;
    font-weight: 500;
    font-size: var(--fs-sm-500);
    letter-spacing: 0.5px;
  }
  .overline {
    font-family: "Geist", "Roboto", -apple-system, "Segoe UI", sans-serif;
    font-weight: 800;
    font-size: var(--fs-sm-200);
    letter-spacing: -0.01em;
    text-transform: uppercase;
    /* Add support for variable font settings */
  }
  @supports not (font-variation-settings: "wght" 500) {
    .overline {
      font-family: "Mona Sans", "Roboto", -apple-system, "Segoe UI", sans-serif;
    }
  }
  @supports (font-variation-settings: "wght" 500) {
    .overline {
      font-family: "Geist", "Roboto", -apple-system, "Segoe UI", sans-serif;
      font-optical-sizing: auto;
      letter-spacing: -0.15px;
      transition: font-variation-settings 500ms linear(0, 0.00217 0.5%, 0.00866 1.01%, 0.0346 2.07%, 0.0782 3.2%, 0.14066 4.43%, 0.28086 6.651%, 0.72289 12.911%, 0.84164 14.861%, 0.93834 16.722%, 1.01676 18.572%, 1.07743 20.432%, 1.12131 22.332%, 1.1373 23.312%, 1.14934 24.312%, 1.15904 25.603%, 1.16294 26.953%, 1.16113 28.383%, 1.15356 29.933%, 1.14335 31.273%, 1.12887 32.783%, 1.05059 39.614%, 1.01677 43.094%, 1.00206, 0.99057 46.975%, 0.98215 48.945%, 0.9766 50.995%, 0.9735 53.835%, 0.97488 57.056%, 0.9966 69.827%, 1.00329 76.878%, 1.00417 83.808%, 0.99996);
      font-variation-settings: var(--vfs-heading-bold);
    }
  }
  p,
  a {
    font-weight: 400;
    font-size: var(--fs-sm-200);
    letter-spacing: 0.4px;
    line-height: 20px;
  }
  p {
    margin-top: 0;
    margin-bottom: 0.5rem;
    text-wrap: balance;
  }
  @supports (text-wrap: pretty) {
    p {
      text-wrap: pretty;
    }
  }
  a,
  .anchor-link {
    --_hyperlink-color: var(--theme-primary-a10);
    --_hyperlink-bg-color: var(--theme-primary-a20);
    --_hyperlink-radius: 50px;
    --_hyperlink-easing-in: cubic-bezier(0.05, 0.7, 0.1, 1);
    --_hyperlink-easing-duration: 200ms;
    color: var(--_hyperlink-color);
    text-decoration: none;
    position: relative;
    cursor: pointer;
  }
  @supports (transition: all 100ms linear(1, 1, 1)) {
    a,
    .anchor-link {
      --_hyperlink-easing-in: linear(0, 0.00217 0.5%, 0.00866 1.01%, 0.0346 2.07%, 0.0782 3.2%, 0.14066 4.43%, 0.28086 6.651%, 0.72289 12.911%, 0.84164 14.861%, 0.93834 16.722%, 1.01676 18.572%, 1.07743 20.432%, 1.12131 22.332%, 1.1373 23.312%, 1.14934 24.312%, 1.15904 25.603%, 1.16294 26.953%, 1.16113 28.383%, 1.15356 29.933%, 1.14335 31.273%, 1.12887 32.783%, 1.05059 39.614%, 1.01677 43.094%, 1.00206, 0.99057 46.975%, 0.98215 48.945%, 0.9766 50.995%, 0.9735 53.835%, 0.97488 57.056%, 0.9966 69.827%, 1.00329 76.878%, 1.00417 83.808%, 0.99996);
      --_hyperlink-easing-duration: 800ms;
    }
  }
  a:is(.undecorated, .navigation-drawer .drawer-content .drawer-body .drawer-item:is(a), .navbar .navbar-brand span, .navbar .navbar-brand a, .navbar .navbar-collapse .navbar-nav .nav-item .nav-link, .navigation-bar .navigation-bar-item .navigation-bar-link, .menu-user-container .menu-user .menu-user-body .menu-user-item, .menu-tools-container .menu-tools .menu-body .menu-grid .menu-link, .list-group .list-group-item .list-item:is(a), .v-popper__popper.v-popper--theme-dropdown .v-popper__wrapper .v-popper__inner ul li .v-dropdown-item:is(a, span), .btn):after,
  .anchor-link:is(.undecorated, .navigation-drawer .drawer-content .drawer-body .drawer-item:is(a), .navbar .navbar-brand span, .navbar .navbar-brand a, .navbar .navbar-collapse .navbar-nav .nav-item .nav-link, .navigation-bar .navigation-bar-item .navigation-bar-link, .menu-user-container .menu-user .menu-user-body .menu-user-item, .menu-tools-container .menu-tools .menu-body .menu-grid .menu-link, .list-group .list-group-item .list-item:is(a), .v-popper__popper.v-popper--theme-dropdown .v-popper__wrapper .v-popper__inner ul li .v-dropdown-item:is(a, span), .btn):after {
    content: none;
  }
  a:after,
  .anchor-link:after {
    content: "";
    position: absolute;
    bottom: -0.15em;
    left: 0;
    margin: auto;
    width: 100%;
    height: 2px;
    background: var(--_hyperlink-bg-color);
    border-radius: var(--_hyperlink-radius);
    opacity: 0;
    scale: 0 0;
    transition: opacity var(--_hyperlink-easing-duration) var(--_hyperlink-easing-in), scale var(--_hyperlink-easing-duration) var(--_hyperlink-easing-in);
  }
  a:is(:hover),
  .anchor-link:is(:hover) {
    color: var(--theme-primary-a20);
    text-decoration: none;
  }
  a:is(:hover):after,
  .anchor-link:is(:hover):after {
    opacity: 1;
    scale: 1 1;
  }
  a:is(:active, :focus),
  .anchor-link:is(:active, :focus) {
    color: var(--theme-primary-a30);
    text-decoration: none;
  }
  label,
  .label {
    font-family: "Mona Sans", "Roboto", -apple-system, "Segoe UI", sans-serif;
    font-weight: 600;
    font-size: var(--fs-sm-400);
    letter-spacing: -0.01em;
    color: var(--theme-on-primary);
    margin-bottom: 0.75rem;
  }
  code {
    --_code-color: var(--theme-muted-a10);
    font-size: var(--fs-sm-400);
    color: var(--_code-color);
    cursor: pointer;
  }
  @supports (font-feature-settings: "colr") {
    code {
      font-family: "Monaspace", monospace;
      font-feature-settings: "colr", "calt";
    }
  }
  kbd {
    font-weight: 600;
    font-size: var(--fs-sm-300);
    padding: 0.1875rem 0.375rem;
    color: var(--theme-on-primary-container);
    background-color: var(--theme-surface-toast);
    border: 1px solid var(--theme-surface-toast);
    box-shadow: var(--shadow-sm);
    border-radius: 6px;
  }
}
@layer components.accordion {
  .accordion-group {
    --_accordion-bg-color: var(--theme-surface-container-lowest);
    --_accordion-color: var(--theme-on-primary);
    --_accordion-radius: 12px;
    --_accordion-border-color: transparent;
    --_accordion-gap: .5rem;
    --_accordion-gutter: 0.75rem;
    --_accordion-easing-in: cubic-bezier(0.05, 0.7, 0.1, 1);
    --_accordion-easing-duration: 200ms;
    display: grid;
    grid-template-rows: 1fr;
    gap: var(--_accordion-gap);
  }
  .accordion-group .accordion {
    display: flex;
    flex-direction: column;
    gap: var(--_accordion-gap);
    background-color: var(--_accordion-bg-color);
    padding: var(--_accordion-gutter);
    width: 100%;
    height: 100%;
  }
  .accordion-group .accordion:is(:first-child) {
    border-radius: var(--_accordion-radius) var(--_accordion-radius) 6px 6px;
  }
  .accordion-group .accordion:is(:last-child) {
    border-radius: 6px 6px var(--_accordion-radius) var(--_accordion-radius);
  }
  .accordion-group .accordion:not(:first-child, :last-child) {
    border-radius: 6px;
  }
  .accordion-group .accordion:is(:hover) {
    background-color: var(--theme-surface-container-low);
  }
  .accordion-group .accordion .accordion-header {
    position: relative;
    display: flex;
    flex-direction: row;
    padding-block: calc(var(--_accordion-gutter) / 2);
    cursor: pointer;
    background-color: transparent;
  }
  .accordion-group .accordion .accordion-header .accordion-title {
    font-size: var(--fs-sm-100);
    font-weight: 800;
    font-family: "Mona Sans", "Roboto", -apple-system, "Segoe UI", sans-serif;
    color: var(--_accordion-color);
    line-height: 1.5;
    margin-bottom: 0;
  }
  .accordion-group .accordion .accordion-header:is(:hover) .accordion-title {
    color: var(--theme-primary-a10);
  }
  .accordion-group .accordion .accordion-header:after {
    content: "keyboard_arrow_down";
    font-family: "Material Symbols Rounded", sans-serif;
    font-size: var(--fs-200);
    color: var(--theme-muted-a10);
    position: absolute;
    top: 0;
    right: 0;
    rotate: 0deg;
    transition: rotate var(--_accordion-easing-duration) var(--_accordion-easing-in);
  }
  .accordion-group .accordion .accordion-body p {
    color: var(--theme-muted-a10);
    line-height: 1.75;
  }
  .accordion-group .accordion:has(.accordion-body:is(.accordion-open)) .accordion-header:after {
    rotate: 180deg;
  }
  @supports (transition: linear(1, 1, 1)) {
    .accordion-group {
      --_accordion-easing-in: linear(0, 0.00217 0.5%, 0.00866 1.01%, 0.0346 2.07%, 0.0782 3.2%, 0.14066 4.43%, 0.28086 6.651%, 0.72289 12.911%, 0.84164 14.861%, 0.93834 16.722%, 1.01676 18.572%, 1.07743 20.432%, 1.12131 22.332%, 1.1373 23.312%, 1.14934 24.312%, 1.15904 25.603%, 1.16294 26.953%, 1.16113 28.383%, 1.15356 29.933%, 1.14335 31.273%, 1.12887 32.783%, 1.05059 39.614%, 1.01677 43.094%, 1.00206, 0.99057 46.975%, 0.98215 48.945%, 0.9766 50.995%, 0.9735 53.835%, 0.97488 57.056%, 0.9966 69.827%, 1.00329 76.878%, 1.00417 83.808%, 0.99996);
      --_accordion-easing-duration: 600ms;
    }
  }
  .accordion-slide-block-enter-active {
    transition: translate var(--_accordion-easing-duration) var(--_accordion-easing-in), opacity var(--_accordion-easing-duration) var(--_accordion-easing-in);
  }
  .accordion-slide-block-leave-active {
    transition: translate 400ms cubic-bezier(0.05, 0.7, 0.1, 1), opacity 200ms cubic-bezier(0.4, 0, 1, 1);
  }
  .accordion-slide-block-enter-from {
    opacity: 0;
    translate: 0 -1.85rem;
  }
  .accordion-slide-block-leave-to {
    opacity: 0;
    translate: 0 -1.85rem;
  }
}
@layer components.alert {
  .alert-container {
    --_alert-border-radius: 8px;
    border-radius: var(--_alert-border-radius);
    container: alert-container/inline-size;
  }
  .alert-container:has(.alert-snackbar) {
    position: fixed;
    bottom: 1.85rem;
    inset-inline: 0;
    margin: auto;
    width: 100%;
    max-width: 90%;
    z-index: 999;
  }
  .alert {
    --_alert-color: var(--theme-on-primary-container);
    --_alert-bg-color: var(--theme-surface-toast);
    --_alert-border-color: var(--theme-outline-button);
    --_alert-border-radius: 8px;
    --_alert-font-size: var(--fs-sm-400);
    --_alert-font-weight: 600;
    --_alert-icon-size: 1.75em;
    --_alert-gutter-y: .75rem;
    --_alert-gutter-x: .75rem;
    --_alert-gap: .5rem;
    --_alert-flex-direction: row;
    display: flex;
    flex-direction: var(--_alert-flex-direction);
    padding-block: var(--_alert-gutter-y);
    padding-inline: var(--_alert-gutter-x);
    font-size: var(--_alert-font-size);
    font-weight: var(--_alert-font-weight);
    line-height: 1.5;
    white-space: normal;
    align-items: center;
    gap: var(--_alert-gap);
    border-radius: var(--_alert-border-radius);
    color: var(--_alert-color);
    background-color: var(--_alert-bg-color);
    border: 1px solid var(--_alert-border-color);
  }
  .alert i {
    font-size: var(--_alert-icon-size);
    font-variation-settings: var(--iw-semi-bold);
  }
  .alert p, .alert a {
    font-size: var(--_alert-font-size);
    font-weight: var(--_alert-font-weight);
    color: var(--_alert-color);
    line-height: 1.5;
    margin-bottom: 0;
  }
  .alert:has(i) {
    --_alert-gap: .5rem;
    --_alert-flex-direction: row;
    align-items: center;
  }
  .alert:has(.alert-title) .alert-content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
  }
  .alert .alert-content {
    text-wrap: balance;
  }
  @supports (text-wrap: pretty) {
    .alert .alert-content {
      text-wrap: pretty;
    }
  }
  .alert .alert-content .alert-title {
    --_alert-font-size: var(--fs-sm-100);
    --_alert-font-weight: 800;
    font-family: "Mona Sans", "Roboto", -apple-system, "Segoe UI", sans-serif;
    color: currentColor;
  }
  .alert.alert-sm {
    --_alert-icon-size: 1.5em;
    --_alert-gutter-y: .5rem;
    --_alert-gutter-x: .5rem;
  }
  .alert.alert-success {
    --_alert-color: var(--theme-on-primary-container);
    --_alert-bg-color: var(--theme-success-a10);
    --_alert-border-color: var(--theme-success-a90);
  }
  .alert.alert-warning {
    --_alert-color: var(--theme-on-secondary);
    --_alert-bg-color: var(--theme-warning-a10);
    --_alert-border-color: var(--theme-warning-a90);
  }
  .alert.alert-danger {
    --_alert-color: var(--theme-on-primary-container);
    --_alert-bg-color: var(--theme-danger-a10);
    --_alert-border-color: var(--theme-danger-a90);
  }
  .alert.alert-tonal.tonal-primary {
    --_alert-border-color: var(--theme-primary-a90);
    --_alert-bg-color: color-mix(in srgb, var(--theme-primary-a10), var(--theme-on-primary-inverse) var(--theme-tonal-dark-intensity));
    --_alert-color: var(--theme-primary-a90);
  }
  .alert.alert-tonal.tonal-secondary {
    --_alert-border-color: var(--theme-secondary-a90);
    --_alert-bg-color: color-mix(in srgb, var(--theme-secondary-a10), var(--theme-on-primary-inverse) var(--theme-tonal-dark-intensity));
    --_alert-color: var(--theme-secondary-a90);
  }
  .alert.alert-tonal.tonal-accent {
    --_alert-border-color: var(--theme-accent-a90);
    --_alert-bg-color: color-mix(in srgb, var(--theme-accent-a10), var(--theme-on-primary-inverse) var(--theme-tonal-dark-intensity));
    --_alert-color: var(--theme-accent-a90);
  }
  .alert.alert-tonal.tonal-success {
    --_alert-border-color: var(--theme-success-a90);
    --_alert-bg-color: color-mix(in srgb, var(--theme-success-a10), var(--theme-on-primary-inverse) var(--theme-tonal-dark-intensity));
    --_alert-color: var(--theme-success-a90);
  }
  .alert.alert-tonal.tonal-warning {
    --_alert-border-color: var(--theme-warning-a90);
    --_alert-bg-color: color-mix(in srgb, var(--theme-warning-a10), var(--theme-on-primary-inverse) var(--theme-tonal-dark-intensity));
    --_alert-color: var(--theme-warning-a90);
  }
  .alert.alert-tonal.tonal-danger {
    --_alert-border-color: var(--theme-danger-a90);
    --_alert-bg-color: color-mix(in srgb, var(--theme-danger-a10), var(--theme-on-primary-inverse) var(--theme-tonal-dark-intensity));
    --_alert-color: var(--theme-danger-a90);
  }
  .alert.alert-tonal.tonal-default {
    --_alert-border-color: var(--theme-surface-a90);
    --_alert-bg-color: color-mix(in srgb, var(--theme-surface-a60), var(--theme-on-primary-inverse) var(--theme-tonal-dark-intensity));
    --_alert-color: var(--theme-surface-a90);
  }
  .alert.alert-transparent {
    --_alert-bg-color: transparent;
    --_alert-border-color: transparent;
  }
  .alert.alert-snackbar {
    margin: auto;
    width: fit-content;
    max-width: 90%;
  }
  .alert.alert-snackbar.show {
    display: flex;
    animation: fade-in-down 300ms ease-in-out;
  }
  @container alert-container (width <= 300px) {
    .alert {
      --_alert-flex-direction: column;
    }
    .alert:has(i) {
      --_alert-flex-direction: column;
      align-items: flex-start;
    }
  }
  .pwa-alert-container {
    --_pwa-alert-position-x: 1rem;
    --_pwa-alert-position-y: 1rem;
    position: fixed;
    right: var(--_pwa-alert-position-x);
    bottom: var(--_pwa-alert-position-y);
    width: fit-content;
    max-width: 30%;
    margin: auto;
    z-index: 999;
    padding-block: 1rem;
    padding-inline: 1rem;
    background: var(--theme-surface-container-high);
    border: 1px solid var(--theme-outline-surface);
    box-shadow: var(--shadow-lg);
    border-radius: 12px;
    animation: fade-in-down 300ms ease-in-out;
  }
  .pwa-alert-container i {
    font-variation-settings: var(--iw-semi-bold);
    color: var(--theme-on-primary);
    margin-bottom: 0.35rem;
  }
  .pwa-alert-container p:is(.subtitle-1) {
    font-size: var(--fs-600);
    font-weight: 800;
    font-family: "Mona Sans", "Roboto", -apple-system, "Segoe UI", sans-serif;
    margin-bottom: 0.25rem;
  }
  .pwa-alert-container p:is(.subtitle-2) {
    color: var(--theme-muted-a10);
    margin-bottom: 0.75rem;
    text-wrap: balance;
  }
  @supports (text-wrap: pretty) {
    .pwa-alert-container p:is(.subtitle-2) {
      text-wrap: pretty;
    }
  }
  .pwa-alert-container .pwa-actions {
    display: flex;
    gap: 0.5rem;
  }
  .pwa-alert-container .pwa-actions .btn {
    margin: 0;
  }
}
@layer components.badge {
  .badge {
    --_badge-color: var(--theme-on-primary);
    --_badge-bg-color: var(--theme-surface-container-high);
    --_badge-border-color: var(--theme-outline-button);
    --_badge-border-radius: 50px;
    --_badge-font-size: var(--fs-sm-500);
    --_badge-font-weight: 500;
    --_badge-gutter-y: .25rem;
    --_badge-gutter-x: .5rem;
    display: inline-flex;
    padding-block: var(--_badge-gutter-y);
    padding-inline: var(--_badge-gutter-x);
    margin-inline: calc(var(--_badge-gutter-x) - 0.35rem);
    font-size: var(--_badge-font-size);
    font-weight: var(--_badge-font-weight);
    line-height: 1;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    align-items: center;
    border-radius: var(--_badge-border-radius);
    color: var(--_badge-color);
    background-color: var(--_badge-bg-color);
    border: 1px solid var(--_badge-border-color);
  }
  .badge.badge-primary {
    --_badge-color: var(--theme-on-primary-inverse);
    --_badge-bg-color: var(--theme-primary-a10);
    --_badge-border-color: var(--theme-primary-a30);
  }
  .badge.badge-secondary {
    --_badge-color: var(--theme-on-secondary);
    --_badge-bg-color: var(--theme-secondary-a10);
    --_badge-border-color: var(--theme-secondary-a30);
  }
  .badge.badge-accent {
    --_badge-color: var(--theme-on-secondary);
    --_badge-bg-color: var(--theme-accent-a10);
    --_badge-border-color: var(--theme-accent-a30);
  }
  .badge.badge-default {
    --_badge-color: var(--theme-on-background);
    --_badge-bg-color: var(--theme-default);
    --_badge-border-color: var(--theme-default-active);
  }
  .badge.badge-outline {
    --_badge-bg-color: transparent;
    --_badge-border-color: var(--theme-outline-surface);
  }
  .badge.badge-success {
    --_badge-color: var(--theme-on-primary-container);
    --_badge-bg-color: var(--theme-success-a10);
    --_badge-border-color: var(--theme-success-a30);
  }
  .badge.badge-warning {
    --_badge-color: var(--theme-on-secondary);
    --_badge-bg-color: var(--theme-warning-a10);
    --_badge-border-color: var(--theme-warning-a30);
  }
  .badge.badge-danger {
    --_badge-color: var(--theme-on-primary-container);
    --_badge-bg-color: var(--theme-danger-a10);
    --_badge-border-color: var(--theme-danger-a30);
  }
  .badge.badge-tonal.tonal-primary {
    --_badge-border-color: color-mix(in srgb, var(--theme-primary-a10), var(--theme-on-primary-inverse) var(--theme-tonal-dark-intensity));
    --_badge-bg-color: color-mix(in srgb, var(--theme-primary-a10), var(--theme-on-primary-inverse) var(--theme-tonal-dark-intensity));
    --_badge-color: var(--theme-primary-a90);
  }
  .badge.badge-tonal.tonal-secondary {
    --_badge-border-color: color-mix(in srgb, var(--theme-secondary-a10), var(--theme-on-primary-inverse) var(--theme-tonal-dark-intensity));
    --_badge-bg-color: color-mix(in srgb, var(--theme-secondary-a10), var(--theme-on-primary-inverse) var(--theme-tonal-dark-intensity));
    --_badge-color: var(--theme-secondary-a90);
  }
  .badge.badge-tonal.tonal-accent {
    --_badge-border-color: color-mix(in srgb, var(--theme-accent-a10), var(--theme-on-primary-inverse) var(--theme-tonal-dark-intensity));
    --_badge-bg-color: color-mix(in srgb, var(--theme-accent-a10), var(--theme-on-primary-inverse) var(--theme-tonal-dark-intensity));
    --_badge-color: var(--theme-accent-a90);
  }
  .badge.badge-tonal.tonal-success {
    --_badge-border-color: color-mix(in srgb, var(--theme-success-a10), var(--theme-on-primary-inverse) var(--theme-tonal-dark-intensity));
    --_badge-bg-color: color-mix(in srgb, var(--theme-success-a10), var(--theme-on-primary-inverse) var(--theme-tonal-dark-intensity));
    --_badge-color: var(--theme-success-a90);
  }
  .badge.badge-tonal.tonal-warning {
    --_badge-border-color: color-mix(in srgb, var(--theme-warning-a10), var(--theme-on-primary-inverse) var(--theme-tonal-dark-intensity));
    --_badge-bg-color: color-mix(in srgb, var(--theme-warning-a10), var(--theme-on-primary-inverse) var(--theme-tonal-dark-intensity));
    --_badge-color: var(--theme-warning-a90);
  }
  .badge.badge-tonal.tonal-danger {
    --_badge-border-color: color-mix(in srgb, var(--theme-danger-a10), var(--theme-on-primary-inverse) var(--theme-tonal-dark-intensity));
    --_badge-bg-color: color-mix(in srgb, var(--theme-danger-a10), var(--theme-on-primary-inverse) var(--theme-tonal-dark-intensity));
    --_badge-color: var(--theme-danger-a90);
  }
  .badge.badge-tonal.tonal-default {
    --_badge-border-color: color-mix(in srgb, var(--theme-surface-a60), var(--theme-on-primary-inverse) var(--theme-tonal-dark-intensity));
    --_badge-bg-color: color-mix(in srgb, var(--theme-surface-a60), var(--theme-on-primary-inverse) var(--theme-tonal-dark-intensity));
    --_badge-color: var(--theme-surface-a90);
  }
  .badge.badge-pill {
    --_badge-gutter-y: .25rem;
    --_badge-gutter-x: .35rem;
    --_badge-font-weight: 700;
    aspect-ratio: 1;
  }
  .badge.badge-gradient {
    --_badge-gradient-color: hsl(0, 0%, 0%);
    color: var(--_badge-gradient-color);
    font-weight: 800;
    background-image: linear-gradient(45deg, #4ae17b, #11d181);
    background-image: -webkit-linear-gradient(45deg, #4ae17b, #11d181);
  }
  .badge.badge-gradient.g-primary {
    --_badge-gradient-color: hsl(100, 100%, 100%);
    background-image: linear-gradient(45deg, #0023f7, #382bf0);
    background-image: -webkit-linear-gradient(45deg, #0023f7, #382bf0);
  }
  .badge.badge-gradient.g-gold {
    background-image: linear-gradient(45deg, #875919, #a87732, #dbaa64, #f0c588);
    background-image: -webkit-linear-gradient(45deg, #875919, #a87732, #dbaa64, #f0c588);
  }
  .badge.badge-gradient.g-green {
    background-image: linear-gradient(45deg, #4ae17b, #11d181);
    background-image: -webkit-linear-gradient(45deg, #4ae17b, #11d181);
  }
  .badge.badge-gradient.g-cyan {
    background-image: linear-gradient(45deg, #0adeff, #0a81ff);
    background-image: -webkit-linear-gradient(45deg, #0adeff, #0a81ff);
  }
  .badge.badge-gradient.g-yellow {
    background-image: linear-gradient(45deg, #ffe572, #c28333);
    background-image: -webkit-linear-gradient(45deg, #ffe572, #c28333);
  }
  .badge.badge-gradient.g-orange {
    background-image: linear-gradient(45deg, #c20ea1, #dd2d7f, #ee4c5e, #f46d41);
    background-image: -webkit-linear-gradient(45deg, #c20ea1, #dd2d7f, #ee4c5e, #f46d41);
  }
  .badge.badge-gradient.g-purple {
    background-image: linear-gradient(45deg, #c11ceb, #6f19b5, #25007a);
    background-image: -webkit-linear-gradient(45deg, #c11ceb, #6f19b5, #25007a);
  }
  .badge.badge-gradient.g-red {
    background-image: linear-gradient(45deg, #e91e63, #d81557, #aa1145);
    background-image: -webkit-linear-gradient(45deg, #e91e63, #d81557, #aa1145);
  }
  .badge.badge-gradient.g-blue {
    background-image: linear-gradient(45deg, #148ade, #116ab8);
    background-image: -webkit-linear-gradient(45deg, #148ade, #116ab8);
  }
  .badge.badge-gradient.g-black {
    background-image: linear-gradient(45deg, #404040, #212121);
    background-image: -webkit-linear-gradient(45deg, #404040, #212121);
  }
  .badge.badge-gradient.g-indigo {
    background-image: linear-gradient(45deg, #715cff, #6851ff);
    background-image: -webkit-linear-gradient(45deg, #715cff, #6851ff);
  }
  .badge.badge-gradient.g-violet {
    background-image: linear-gradient(45deg, #8200e7, #bf3eff);
    background-image: -webkit-linear-gradient(45deg, #8200e7, #bf3eff);
  }
  .badge.badge-gradient.g-body-primary {
    background-image: linear-gradient(0deg, var(--theme-on-primary), #382bf0);
    background-image: -webkit-linear-gradient(0deg, var(--theme-on-primary), #382bf0);
  }
  .badge.badge-gradient.g-body-secondary {
    background-image: linear-gradient(45deg, var(--theme-on-primary), #ffc107);
    background-image: -webkit-linear-gradient(45deg, var(--theme-on-primary), #ffc107);
  }
  .badge.badge-gradient.g-body-success {
    background-image: linear-gradient(0deg, var(--theme-on-primary), #009f42);
    background-image: -webkit-linear-gradient(0deg, var(--theme-on-primary), #009f42);
  }
  .badge.badge-gradient.g-body-danger {
    background-image: linear-gradient(45deg, var(--theme-on-primary), #b41c2b);
    background-image: -webkit-linear-gradient(45deg, var(--theme-on-primary), #b41c2b);
  }
  .badge:has(i) {
    display: inline-flex;
    gap: 0.25rem;
    align-items: center;
  }
  .badge:has(i) i {
    color: inherit;
    font-size: 16px;
    font-variation-settings: var(--iw-bold);
  }
  .badge.badge-sm {
    --_badge-font-size: 10px;
    --_badge-gutter-y: 0.25rem;
    --_badge-gutter-x: 0.375rem;
    margin-block: 0;
    margin-inline: 0;
  }
  .badge.badge-label {
    --_badge-color: var(--theme-on-primary);
    --_badge-bg-color: var(--theme-frosted-glass-bg);
    --_badge-border-color: var(--theme-outline-button);
    display: inline-flex;
    gap: 0.35rem;
    position: absolute;
    top: 0.5rem;
    right: 0.5rem;
    z-index: 10;
    font-size: 8px;
    backdrop-filter: var(--theme-frosted-glass-backdrop-filter);
    -webkit-backdrop-filter: var(--theme-frosted-glass-backdrop-filter);
  }
  .badge.badge-label i {
    font-size: 14px;
  }
  .badge.badge-label.label-left {
    left: 0.5rem;
    right: auto;
  }
  .badge-group {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 0.45rem 0.55rem;
  }
  .badge-group .badge {
    margin: 0;
  }
}
@layer components.buttons {
  .btn {
    --_btn-bg-color: var(--theme-surface-container);
    --_btn-color: var(--theme-on-primary);
    --_btn-border: 1px;
    --_btn-border-color: transparent;
    --_btn-gap: .25rem;
    --_btn-radius: 0px;
    --_btn-gutter-x: 0.75rem;
    --_btn-gutter-y: 0.65rem;
    --_btn-shadow: var(--shadow-sm);
    --_btn-easing-in: cubic-bezier(0.05, 0.7, 0.1, 1);
    --_btn-easing-duration: 200ms;
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
    justify-content: center;
    gap: var(--_btn-gap);
    border-radius: var(--_btn-radius);
    padding-block: var(--_btn-gutter-y);
    padding-inline: var(--_btn-gutter-x);
    background: var(--_btn-bg-color);
    color: var(--_btn-color);
    border: var(--_btn-border) solid var(--_btn-border-color);
    box-shadow: var(--_btn-shadow);
    font-family: "Geist", "Roboto", -apple-system, "Segoe UI", sans-serif;
    font-weight: 700;
    font-size: 12px;
    letter-spacing: 0.16px;
    text-transform: inherit;
    line-height: 1;
    cursor: pointer;
    user-select: none;
    touch-action: manipulation;
    scale: 1;
    transition: all var(--_btn-easing-duration) var(--_btn-easing-in);
  }
  .btn:has(i) {
    gap: 0.45rem;
  }
  .btn:has(i) :where(i) {
    font-size: 1.25rem !important;
    font-variation-settings: var(--iw-semi-bold);
    color: inherit;
  }
  .btn:is(:hover) {
    --_btn-shadow: var(--shadow-md);
  }
  .btn:is(:hover) i:is(.material-symbols-rounded, .material-symbols-sharp) {
    font-variation-settings: var(--iw-bold);
  }
  .btn:is(:focus, :active) {
    --_btn-shadow: var(--shadow-lg);
    scale: 0.95;
  }
  .btn.btn-filled {
    --_btn-bg-color: var(--theme-primary-a10);
    --_btn-color: var(--theme-on-primary-container);
  }
  .btn.btn-filled:is(:hover) {
    --_btn-bg-color: var(--theme-primary-a20);
  }
  .btn.btn-filled:is(:focus, :active) {
    --_btn-bg-color: var(--theme-primary-a30);
  }
  .btn.btn-filled.filled-secondary {
    --_btn-bg-color: var(--theme-secondary-a10);
    --_btn-color: var(--theme-on-primary-container);
  }
  .btn.btn-filled.filled-success {
    --_btn-bg-color: var(--theme-success-a10);
    --_btn-color: var(--theme-on-success);
  }
  .btn.btn-filled.filled-warning {
    --_btn-bg-color: var(--theme-warning-a10);
    --_btn-color: hsl(0, 0%, 0%);
  }
  .btn.btn-filled.filled-danger {
    --_btn-bg-color: var(--theme-danger-a10);
    --_btn-color: var(--theme-on-primary-container);
  }
  .btn.btn-tonal {
    --_btn-shadow: none;
  }
  .btn.btn-tonal.tonal-primary {
    --_btn-bg-color: color-mix(in srgb, var(--theme-primary-a10), var(--theme-on-primary-inverse) var(--theme-tonal-dark-intensity));
    --_btn-color: var(--theme-primary-a90);
  }
  @supports (color: color-mix(in srgb, red, blue)) {
    .btn.btn-tonal.tonal-primary:is(:hover) {
      --_btn-bg-color: color-mix(in srgb, var(--theme-primary-a10), var(--theme-on-primary-inverse) calc(var(--theme-tonal-dark-intensity) - 10%));
    }
  }
  @supports (color: color-mix(in srgb, red, blue)) {
    .btn.btn-tonal.tonal-primary:is(:focus, :active) {
      --_btn-bg-color: color-mix(in srgb, var(--theme-primary-a10), var(--theme-on-primary-inverse) calc(var(--theme-tonal-dark-intensity) - 20%));
    }
  }
  .btn.btn-tonal.tonal-secondary {
    --_btn-bg-color: color-mix(in srgb, var(--theme-secondary-a10), var(--theme-on-primary-inverse) var(--theme-tonal-dark-intensity));
    --_btn-color: var(--theme-secondary-a90);
  }
  @supports (color: color-mix(in srgb, red, blue)) {
    .btn.btn-tonal.tonal-secondary:is(:hover) {
      --_btn-bg-color: color-mix(in srgb, var(--theme-secondary-a10), var(--theme-on-primary-inverse) calc(var(--theme-tonal-dark-intensity) - 10%));
    }
  }
  @supports (color: color-mix(in srgb, red, blue)) {
    .btn.btn-tonal.tonal-secondary:is(:focus, :active) {
      --_btn-bg-color: color-mix(in srgb, var(--theme-secondary-a10), var(--theme-on-primary-inverse) calc(var(--theme-tonal-dark-intensity) - 20%));
    }
  }
  .btn.btn-tonal.tonal-accent {
    --_btn-bg-color: color-mix(in srgb, var(--theme-accent-a10), var(--theme-on-primary-inverse) var(--theme-tonal-dark-intensity));
    --_btn-color: var(--theme-accent-a90);
  }
  @supports (color: color-mix(in srgb, red, blue)) {
    .btn.btn-tonal.tonal-accent:is(:hover) {
      --_btn-bg-color: color-mix(in srgb, var(--theme-accent-a10), var(--theme-on-primary-inverse) calc(var(--theme-tonal-dark-intensity) - 10%));
    }
  }
  @supports (color: color-mix(in srgb, red, blue)) {
    .btn.btn-tonal.tonal-accent:is(:focus, :active) {
      --_btn-bg-color: color-mix(in srgb, var(--theme-accent-a10), var(--theme-on-primary-inverse) calc(var(--theme-tonal-dark-intensity) - 20%));
    }
  }
  .btn.btn-tonal.tonal-success {
    --_btn-bg-color: color-mix(in srgb, var(--theme-success-a10), var(--theme-on-primary-inverse) var(--theme-tonal-dark-intensity));
    --_btn-color: var(--theme-success-a90);
  }
  @supports (color: color-mix(in srgb, red, blue)) {
    .btn.btn-tonal.tonal-success:is(:hover) {
      --_btn-bg-color: color-mix(in srgb, var(--theme-success-a10), var(--theme-on-primary-inverse) calc(var(--theme-tonal-dark-intensity) - 10%));
    }
  }
  @supports (color: color-mix(in srgb, red, blue)) {
    .btn.btn-tonal.tonal-success:is(:focus, :active) {
      --_btn-bg-color: color-mix(in srgb, var(--theme-success-a10), var(--theme-on-primary-inverse) calc(var(--theme-tonal-dark-intensity) - 20%));
    }
  }
  .btn.btn-tonal.tonal-warning {
    --_btn-bg-color: color-mix(in srgb, var(--theme-warning-a10), var(--theme-on-primary-inverse) var(--theme-tonal-dark-intensity));
    --_btn-color: var(--theme-warning-a90);
  }
  @supports (color: color-mix(in srgb, red, blue)) {
    .btn.btn-tonal.tonal-warning:is(:hover) {
      --_btn-bg-color: color-mix(in srgb, var(--theme-warning-a10), var(--theme-on-primary-inverse) calc(var(--theme-tonal-dark-intensity) - 10%));
    }
  }
  @supports (color: color-mix(in srgb, red, blue)) {
    .btn.btn-tonal.tonal-warning:is(:focus, :active) {
      --_btn-bg-color: color-mix(in srgb, var(--theme-warning-a10), var(--theme-on-primary-inverse) calc(var(--theme-tonal-dark-intensity) - 20%));
    }
  }
  .btn.btn-tonal.tonal-danger {
    --_btn-bg-color: color-mix(in srgb, var(--theme-danger-a10), var(--theme-on-primary-inverse) var(--theme-tonal-dark-intensity));
    --_btn-color: var(--theme-danger-a90);
  }
  @supports (color: color-mix(in srgb, red, blue)) {
    .btn.btn-tonal.tonal-danger:is(:hover) {
      --_btn-bg-color: color-mix(in srgb, var(--theme-danger-a10), var(--theme-on-primary-inverse) calc(var(--theme-tonal-dark-intensity) - 10%));
    }
  }
  @supports (color: color-mix(in srgb, red, blue)) {
    .btn.btn-tonal.tonal-danger:is(:focus, :active) {
      --_btn-bg-color: color-mix(in srgb, var(--theme-danger-a10), var(--theme-on-primary-inverse) calc(var(--theme-tonal-dark-intensity) - 20%));
    }
  }
  .btn.btn-tonal.tonal-neutral {
    --_btn-bg-color: color-mix(in srgb, var(--theme-surface-a40), var(--theme-on-primary-inverse) var(--theme-tonal-light-intensity));
    --_btn-color: var(--theme-surface-a90);
  }
  @supports (color: color-mix(in srgb, red, blue)) {
    .btn.btn-tonal.tonal-neutral:is(:hover) {
      --_btn-bg-color: color-mix(in srgb, var(--theme-surface-a40), var(--theme-on-primary-inverse) calc(var(--theme-tonal-light-intensity) - 10%));
    }
  }
  @supports (color: color-mix(in srgb, red, blue)) {
    .btn.btn-tonal.tonal-neutral:is(:focus, :active) {
      --_btn-bg-color: color-mix(in srgb, var(--theme-surface-a40), var(--theme-on-primary-inverse) calc(var(--theme-tonal-light-intensity) - 20%));
    }
  }
  .btn.btn-outline {
    --_btn-bg-color: transparent;
    --_btn-shadow: none;
    --_btn-border-color: var(--theme-outline-button);
  }
  .btn.btn-outline:is(:hover) {
    --_btn-bg-color: var(--theme-surface-container-lowest);
    --_btn-shadow: var(--shadow-sm);
  }
  .btn.btn-outline:is(:focus, :active) {
    --_btn-bg-color: var(--theme-surface-container-low);
    --_btn-shadow: var(--shadow-md);
  }
  .btn.btn-outline-gradient {
    --_btn-bg-color: transparent;
    --_btn-bg-gradient: var(--theme-surface-a0), var(--theme-surface-a0);
    --_border-gradient: var(--theme-primary-a10), var(--theme-primary-a30);
    background: linear-gradient(var(--_btn-bg-gradient)) padding-box, linear-gradient(120deg, var(--_border-gradient)) border-box;
  }
  .btn.btn-outline-gradient.g-primary {
    --_badge-gradient-color: hsl(100, 100%, 100%);
    --_border-gradient: #0023f7, #382bf0;
  }
  .btn.btn-outline-gradient.g-gold {
    --_border-gradient: #875919, #a87732, #dbaa64, #f0c588;
  }
  .btn.btn-outline-gradient.g-green {
    --_border-gradient: #4ae17b, #11d181;
  }
  .btn.btn-outline-gradient.g-cyan {
    --_border-gradient: #0adeff, #0a81ff;
  }
  .btn.btn-outline-gradient.g-yellow {
    --_border-gradient: #ffe572, #c28333;
  }
  .btn.btn-outline-gradient.g-orange {
    --_border-gradient: #c20ea1, #dd2d7f, #ee4c5e, #f46d41;
  }
  .btn.btn-outline-gradient.g-purple {
    --_border-gradient: #c11ceb, #6f19b5, #25007a;
  }
  .btn.btn-outline-gradient.g-red {
    --_border-gradient: #e91e63, #d81557, #aa1145;
  }
  .btn.btn-outline-gradient.g-blue {
    --_border-gradient: #148ade, #116ab8;
  }
  .btn.btn-outline-gradient.g-black {
    --_border-gradient: #404040, #212121;
  }
  .btn.btn-outline-gradient.g-indigo {
    --_border-gradient: #715cff, #6851ff;
  }
  .btn.btn-outline-gradient.g-violet {
    --_border-gradient: #8200e7, #bf3eff;
  }
  .btn.btn-outline-gradient.g-body-primary {
    --_border-gradient: var(--theme-on-primary), #382bf0;
  }
  .btn.btn-outline-gradient.g-body-secondary {
    --_border-gradient: var(--theme-on-primary), #ffc107;
  }
  .btn.btn-outline-gradient.g-body-success {
    --_border-gradient: var(--theme-on-primary), #009f42;
  }
  .btn.btn-outline-gradient.g-body-danger {
    --_border-gradient: var(--theme-on-primary), #b41c2b;
  }
  .btn.btn-outline-gradient:is(.bg-gradient-pane) {
    --_btn-bg-gradient: var(--theme-surface-body-pane), var(--theme-surface-body-pane);
  }
  .btn.btn-outline-gradient:is(.border-md) {
    --_btn-border: 1.5px;
  }
  .btn.btn-text {
    --_btn-bg-color: transparent;
    --_btn-color: var(--theme-primary-base);
    --_btn-shadow: none;
  }
  .btn.btn-text:is(.text-neutral) {
    --_btn-color: var(--theme-on-primary);
  }
  .btn.btn-text:is(:hover) {
    --_btn-shadow: none;
    --_btn-bg-color: color-mix(in srgb, var(--theme-primary-a10), var(--theme-on-primary-inverse) var(--theme-tonal-dark-intensity));
    --_btn-color: var(--theme-primary-a90);
  }
  @supports (color: color-mix(in srgb, red, blue)) {
    .btn.btn-text:is(:hover):is(:hover) {
      --_btn-bg-color: color-mix(in srgb, var(--theme-primary-a10), var(--theme-on-primary-inverse) calc(var(--theme-tonal-dark-intensity) - 10%));
    }
  }
  @supports (color: color-mix(in srgb, red, blue)) {
    .btn.btn-text:is(:hover):is(:focus, :active) {
      --_btn-bg-color: color-mix(in srgb, var(--theme-primary-a10), var(--theme-on-primary-inverse) calc(var(--theme-tonal-dark-intensity) - 20%));
    }
  }
  .btn.btn-text:is(:focus, :active) {
    --_btn-shadow: none;
    --_btn-bg-color: color-mix(in srgb, var(--theme-primary-a20), var(--theme-on-primary-inverse) var(--theme-tonal-dark-intensity));
    --_btn-color: var(--theme-primary-a90);
  }
  @supports (color: color-mix(in srgb, red, blue)) {
    .btn.btn-text:is(:focus, :active):is(:hover) {
      --_btn-bg-color: color-mix(in srgb, var(--theme-primary-a20), var(--theme-on-primary-inverse) calc(var(--theme-tonal-dark-intensity) - 10%));
    }
  }
  @supports (color: color-mix(in srgb, red, blue)) {
    .btn.btn-text:is(:focus, :active):is(:focus, :active) {
      --_btn-bg-color: color-mix(in srgb, var(--theme-primary-a20), var(--theme-on-primary-inverse) calc(var(--theme-tonal-dark-intensity) - 20%));
    }
  }
  .btn.btn-link {
    --_btn-bg-color: var(--theme-surface-container);
    --_btn-color: var(--theme-on-primary);
    --_btn-shadow: none;
  }
  .btn.btn-link:is(:hover) {
    --_btn-color: var(--theme-primary-a10);
    --_btn-bg-color: var(--theme-surface-container-high);
  }
  .btn.btn-link:is(.router-link-exact-active, .router-link-exact-active) {
    --_btn-color: var(--theme-primary-a10);
    --_btn-bg-color: var(--theme-surface-container-highest);
    --_btn-shadow: var(--shadow-sm);
  }
  .btn.btn-chip {
    --_btn-bg-color: transparent;
    --_btn-border-color: var(--theme-outline-button);
    --_btn-gap: .5rem;
    --_btn-radius: 8px;
    --_btn-shadow: none;
    --_btn-gutter-x: 0.65rem;
    --_btn-gutter-y: 0.45rem;
    font-weight: 600;
    font-size: 12px;
  }
  .btn.btn-chip :where(i) {
    font-size: 1rem;
  }
  .btn.btn-chip:is(:hover) {
    --_btn-bg-color: var(--theme-surface-container-high);
    --_btn-shadow: none;
  }
  .btn.btn-chip:is(:focus, :active) {
    --_btn-bg-color: var(--theme-surface-container-high);
    --_btn-shadow: none;
  }
  .btn.btn-chip:is(.chip-text) {
    --_btn-border-color: transparent;
  }
  .btn.btn-chip:is(.chip-active) {
    --_btn-bg-color: var(--theme-surface-container-high);
    --_btn-border-color: var(--theme-surface-container-high);
    padding-inline: 1rem;
  }
  .btn.btn-chip:is(.chip-active):is(.a40) {
    --_btn-bg-color: var(--theme-surface-a40);
    --_btn-border-color: var(--theme-surface-a40);
  }
  .btn.btn-chip:is(.chip-active):is(.a60) {
    --_btn-bg-color: var(--theme-surface-a60);
    --_btn-border-color: var(--theme-surface-a60);
  }
  .btn.btn-gradient {
    --_btn-shadow: rgba(255, 255, 255, 0.2) 0px 2px 3.1px inset;
    --_btn-border-color: var(--theme-primary-base);
    --_btn-bg-gradient: var(--theme-primary-a30), var(--theme-primary-base);
    background: linear-gradient(var(--gradient-angle), var(--_btn-bg-gradient));
    color: var(--theme-on-primary-inverse);
    transition: all 800ms linear(0, 0.00245 1.753%, 0.00994 3.55%, 0.01966 4.916%, 0.03415 6.402%, 0.05334 7.836%, 0.07376 9.061%, 0.10031 10.32%, 0.12808 11.414%, 0.19399 13.366%, 0.27138 14.974%, 0.34403 16.052%, 0.47679 17.475%, 0.54434 18.338%, 0.60689 19.389%, 0.66036 20.609%, 0.71671 22.4%, 0.76532 24.589%, 0.78755 25.874%, 0.80828 27.285%, 0.84475 30.42%, 0.86492 32.632%, 0.88332 35.056%, 0.9002 37.721%, 0.91554 40.622%, 0.9295 43.795%, 0.94208 47.239%, 0.95333 50.97%, 0.96327 54.986%, 0.9795 64.011%, 0.99095 74.434%, 0.99774 86.373%, 1), --gradient-angle 800ms linear(0, 0.00245 1.753%, 0.00994 3.55%, 0.01966 4.916%, 0.03415 6.402%, 0.05334 7.836%, 0.07376 9.061%, 0.10031 10.32%, 0.12808 11.414%, 0.19399 13.366%, 0.27138 14.974%, 0.34403 16.052%, 0.47679 17.475%, 0.54434 18.338%, 0.60689 19.389%, 0.66036 20.609%, 0.71671 22.4%, 0.76532 24.589%, 0.78755 25.874%, 0.80828 27.285%, 0.84475 30.42%, 0.86492 32.632%, 0.88332 35.056%, 0.9002 37.721%, 0.91554 40.622%, 0.9295 43.795%, 0.94208 47.239%, 0.95333 50.97%, 0.96327 54.986%, 0.9795 64.011%, 0.99095 74.434%, 0.99774 86.373%, 1);
  }
  .btn.btn-gradient:is(:hover) {
    --gradient-angle: 180deg;
  }
  .btn.btn-gradient:is(:focus, :active) {
    --gradient-angle: 360deg;
  }
  .btn.btn-gradient.gradient-success {
    --_btn-border-color: var(--theme-success-base);
    --_btn-bg-gradient: var(--theme-success-a30), var(--theme-success-base);
  }
  .btn.btn-gradient.gradient-warning {
    --_btn-border-color: var(--theme-warning-base);
    --_btn-bg-gradient: var(--theme-warning-a30), var(--theme-warning-base);
    color: hsl(0, 0%, 0%);
  }
  .btn.btn-gradient.gradient-danger {
    --_btn-border-color: var(--theme-danger-base);
    --_btn-bg-gradient: var(--theme-danger-a30), var(--theme-danger-base);
  }
  .btn.btn-sm {
    --_btn-radius: 6px;
    --_btn-gutter-x: 0.65rem;
    --_btn-gutter-y: 0.45rem;
    font-weight: 600;
    font-size: 12px;
  }
  .btn.btn-sm :where(i) {
    font-size: 1rem;
  }
  .btn.btn-lg {
    --_btn-gutter-x: 0.85rem;
    --_btn-gutter-y: 0.75rem;
    font-size: 14px;
  }
  .btn.btn-lg :where(i) {
    font-size: 1.45rem;
  }
  .btn.btn-icon {
    --_btn-gap: 0;
    --_btn-radius: 50px;
    --_btn-shadow: none;
    --_btn-icon-compact-size: 1rem;
    aspect-ratio: 1;
  }
  .btn.btn-icon.shape-sm {
    --_btn-radius: 6px;
  }
  .btn.btn-icon.shape-md {
    --_btn-radius: 8px;
  }
  .btn.btn-icon.compact-sm {
    --_btn-icon-compact-size: 1rem;
    padding: calc(1rem - 8px);
  }
  .btn.btn-icon.compact-sm i {
    font-size: var(--_btn-icon-compact-size) !important;
    font-variation-settings: var(--iw-semi-bold);
  }
  .btn.btn-icon.compact i {
    font-size: var(--_btn-icon-compact-size);
    font-variation-settings: var(--iw-semi-bold);
  }
  .btn.btn-fab {
    --_btn-gutter-x: 0.85rem;
    --_btn-gutter-y: 0.75rem;
    --_btn-gap: .5rem;
    --_btn-radius: v.$rounded-none;
    --_btn-shadow: var(--shadow-lg);
    width: fit-content;
    height: fit-content;
    aspect-ratio: 1;
    transform-origin: bottom right;
    animation: scale-in var(--_btn-easing-duration) var(--_btn-easing-in);
    --_btn-gutter-x: 1.25rem;
    --_btn-gutter-y: 1rem;
  }
  .btn.btn-fab {
    font-size: 14px;
  }
  .btn.btn-fab:has(i) {
    gap: var(--_btn-gap);
  }
  .btn.btn-fab:has(i) :where(i) {
    font-size: 1.5rem;
  }
  @supports (transition: linear(1, 1, 1)) {
    .btn.btn-fab {
      --_btn-easing-in: linear(0 0%, 0.007 5.35%, 0.0282 10.75%, 0.0638 16.26%, 0.1144 21.96%, 0.1833 28.16%, 0.2717 34.9%, 0.6868 62.19%, 0.775 68.54%, 0.8457 74.3%, 0.9141 81.07%, 0.9621 87.52%, 0.9905 93.8%, 1 100%);
      --_btn-easing-duration: 300ms;
    }
  }
  .btn.btn-fab:has(span) {
    aspect-ratio: unset;
  }
  .btn.btn-fab:is(.fab-mobile) {
    display: none;
  }
  .btn.btn-cta {
    --_btn-radius: 50px;
    --_btn-gutter-x: 2.5rem;
    --_btn-gutter-y: 1.5rem;
  }
  .btn:is(:disabled, .disabled) {
    --_btn-bg-color: var(--theme-surface-disabled);
    --_btn-color: var(--theme-muted-a10);
    --_btn-border-color: var(--theme-outline-button);
    --_btn-shadow: none;
    cursor: not-allowed;
    opacity: 0.85;
  }
  .btn:is(:disabled, .disabled):is(:hover, :focus, :active) {
    --_btn-bg-color: var(--theme-surface-disabled);
    --_btn-shadow: none;
    scale: none;
  }
  .btn.btn-bounce {
    --_btn-easing-in: linear(0, 0.00097 1.13%, 0.0039 2.27%, 0.01566 4.55%, 0.03518, 0.0625 9.091%, 0.09779 11.371%, 0.14073, 0.19147, 0.25 18.182%, 0.31664 20.462%, 0.3908, 0.47275, 0.5625 27.273%, 0.76538 31.813%, 1 36.364%, 0.94147, 0.89073, 0.84779 43.174%, 0.8125 45.455%, 0.78518, 0.76566, 0.75393 52.265%, 0.75098, 0.75, 0.75098 55.686%, 0.7539 56.816%, 0.76566 59.096%, 0.78518, 0.8125, 0.84761, 0.89052 68.177%, 0.94147 70.457%, 1, 0.97268, 0.95316 77.268%, 0.9414 79.548%, 0.93848 80.678%, 0.9375, 0.93848 82.958%, 0.9414 84.088%, 0.95309, 0.97258 88.629%, 1 90.909%, 0.98829 93.179%, 0.98537 94.309%, 0.98438 95.45%, 0.98533 96.58%, 0.98826 97.72%, 1);
    --_btn-easing-duration: 600ms;
    transition: scale var(--_btn-easing-duration) var(--_btn-easing-in);
  }
  .btn.btn-bounce:is(:hover) {
    scale: 0.85;
  }
  .btn.btn-block {
    text-align: center;
    width: 100%;
  }
  .btn-group {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 0.65rem 0.75rem;
  }
  .btn-group .btn {
    margin: 0;
  }
  .fab-group {
    --_btn-fab-position-y: 1.75rem;
    --_btn-fab-position-x: 1.75rem;
    position: fixed;
    bottom: var(--_btn-fab-position-y);
    right: var(--_btn-fab-position-x);
    display: flex;
    flex-direction: column-reverse;
    align-items: flex-end;
    gap: 1rem;
    isolation: isolate;
    z-index: 999;
  }
  .fab-group.fab-top {
    --_btn-fab-position-y: 1rem;
    position: absolute;
    bottom: unset;
    right: unset;
    top: var(--_btn-fab-position-y);
    left: var(--_btn-fab-position-y);
  }
  .segmented-control {
    --_sc_easing-in: cubic-bezier(0.05, 0.7, 0.1, 1);
    --_sc-easing-duration: 200ms;
    display: flex;
    border: 1px solid var(--theme-outline-button);
    gap: 0.35rem;
    padding: 0.25rem;
    border-radius: calc(14px - 0.25rem);
    position: relative;
  }
  .segmented-control .v-popper {
    z-index: 1;
  }
  .segmented-control .v-popper .btn:is(.btn-chip) {
    margin: 0;
    padding-block: 4px;
  }
  .segmented-control .v-popper .btn:is(.btn-chip):is(:hover, :focus, :active) {
    background: transparent;
  }
  .segmented-control .v-popper .btn:is(.btn-chip).segmented-control-active i {
    color: var(--theme-on-primary);
  }
  .segmented-control:has(.segmented-control-active.active-grid):after {
    translate: calc(100% + 8px);
  }
  .segmented-control:after {
    --_sc-bg-position: 0;
    position: absolute;
    content: "";
    inset-block: 0;
    left: var(--_sc-bg-position);
    margin-block: auto;
    margin-inline: 4px;
    width: calc(50% - 8px);
    height: 85%;
    border-radius: calc(12px - 4px);
    background-color: var(--theme-surface-container-high);
    z-index: 0;
    translate: 0;
    transition: translate var(--_sc-easing-duration) var(--_sc-easing-in);
  }
  @supports (transition: all 100ms linear(1, 1, 1)) {
    .segmented-control {
      --_sc-easing-in: linear(0, 0.00217 0.5%, 0.00866 1.01%, 0.0346 2.07%, 0.0782 3.2%, 0.14066 4.43%, 0.28086 6.651%, 0.72289 12.911%, 0.84164 14.861%, 0.93834 16.722%, 1.01676 18.572%, 1.07743 20.432%, 1.12131 22.332%, 1.1373 23.312%, 1.14934 24.312%, 1.15904 25.603%, 1.16294 26.953%, 1.16113 28.383%, 1.15356 29.933%, 1.14335 31.273%, 1.12887 32.783%, 1.05059 39.614%, 1.01677 43.094%, 1.00206, 0.99057 46.975%, 0.98215 48.945%, 0.9766 50.995%, 0.9735 53.835%, 0.97488 57.056%, 0.9966 69.827%, 1.00329 76.878%, 1.00417 83.808%, 0.99996);
      --_sc-easing-duration: 800ms;
    }
  }
  .ripple {
    position: relative;
    overflow: hidden;
    transform: translate3d(0, 0, 0);
  }
  .ripple:after {
    content: "";
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    pointer-events: none;
    background-repeat: no-repeat;
    background-position: 50%;
    transform: scale(20, 20);
    opacity: 0;
    transition: transform 0.4s, opacity 1s;
    background-image: radial-gradient(circle, hsl(100, 100%, 100%) 10%, transparent 10.01%);
  }
  .ripple.ripple-dark:after {
    background-image: radial-gradient(circle, hsl(0, 0%, 0%) 10%, transparent 10.01%);
  }
  .ripple.ripple-primary:after {
    background-image: radial-gradient(circle, #121212 10%, transparent 10.01%);
  }
  .ripple.ripple-secondary:after {
    background-image: radial-gradient(circle, #0c8eaf 10%, transparent 10.01%);
  }
  .ripple:active:after {
    transform: scale(0, 0);
    opacity: 0.3;
    transition: 0s;
  }
  @media (width >= 1024px) {
    .shine-light {
      --_shine-left: -20%;
      --_shine-display: block;
      position: relative;
      overflow: clip;
      animation: shine-light 800ms forwards ease-in-out;
      animation-delay: 500ms;
    }
    .shine-light:after {
      content: "" !important;
      display: var(--_shine-display);
      position: absolute;
      inset-block: 0;
      left: var(--_shine-left);
      height: 100%;
      width: 10%;
      background: linear-gradient(45deg, rgba(var(--theme-white-rgba), 20%), rgba(var(--theme-white-rgba), 50%));
      mix-blend-mode: hard-light;
      transform: skew(-45deg);
      transition: left 800ms;
      border-radius: 0px;
      scale: unset;
      opacity: unset;
    }
  }
}
@layer components.cards {
  .card {
    --_card-gutter-x: 1rem;
    --_card-gutter-y: 1rem;
    --_card-bg-color: var(--theme-surface-a0);
    --_card-color: var(--theme-on-primary);
    --_card-border: 1px;
    --_card-border-color: transparent;
    --_card-radius: 0px;
    --_card-shadow: none;
    display: flex;
    flex-direction: column;
    min-width: 0;
    position: relative;
    word-wrap: break-word;
    background-clip: border-box;
    background-color: var(--_card-bg-color);
    color: var(--_card-color);
    box-shadow: var(--_card-shadow);
    border: var(--_card-border) solid var(--_card-border-color);
    border-radius: var(--_card-radius);
    transition: all 300ms cubic-bezier(0.05, 0.7, 0.1, 1);
    /** Use it for swiper color tools */
  }
  .card .card-header {
    padding-block: var(--_card-gutter-y) calc(var(--_card-gutter-y) - 0.55rem);
    padding-inline: var(--_card-gutter-x);
    margin-bottom: 0;
    border-radius: 0px 0px 0 0;
  }
  .card .card-header .card-title {
    font-size: var(--fs-600);
    font-weight: 700;
    font-family: "Mona Sans", "Roboto", -apple-system, "Segoe UI", sans-serif;
    margin-bottom: 0;
  }
  .card .card-header:is(:empty) {
    display: none;
  }
  .card .card-body {
    color: var(--_card-color);
    flex: 1 1 auto;
    padding-block: var(--_card-gutter-y) var(--_card-gutter-y);
    padding-inline: var(--_card-gutter-x);
  }
  .card .card-body p:is(.card-text) {
    color: var(--theme-muted-a10);
  }
  .card .card-footer {
    padding-block: calc(var(--_card-gutter-y) / 3) var(--_card-gutter-y);
    padding-inline: var(--_card-gutter-x);
    margin-top: 0;
    border-radius: 0 0 0px 0px;
  }
  .card .card-footer:is(.d-flex, .d-inline-flex) {
    flex-wrap: wrap;
  }
  .card .card-footer:is(:empty) {
    display: none;
  }
  .card.card-outline {
    --_card-border-color: var(--theme-outline-surface);
  }
  .card.card-elevated {
    --_card-shadow: var(--shadow-sm);
  }
  .card.card-elevated:is(:hover) {
    --_card-shadow: var(--shadow-md);
  }
  .card.card-elevated:is(:active, :focus) {
    --_card-shadow: var(--shadow-lg);
  }
  .card.card-selectable {
    --_card-border: 2px;
    --_card-border-color: transparent;
    --_card-selectable-translate: 0 -.5rem;
    cursor: pointer;
    transition: background-color 300ms var(--_card-easing-in), border 300ms var(--_card-easing-in), border-radius 300ms var(--_card-easing-in), translate 600ms var(--_card-easing-in);
  }
  .card.card-selectable > * {
    user-select: none;
  }
  .card.card-selectable:is(:hover) {
    --_card-bg-color: var(--theme-surface-a30);
    translate: var(--_card-selectable-translate);
  }
  .card.card-selectable:is(:active, :focus) {
    --_card-bg-color: var(--theme-surface-a40);
    --_card-border-color: var(--theme-primary-a10);
    --_card-radius: 25px;
  }
  .card.card-selectable:is(.selected) {
    --_card-border-color: var(--theme-primary-a10);
    --_card-radius: 12px;
  }
  @supports (transition: linear(1, 1, 1)) {
    .card.card-selectable {
      --_card-easing-in: linear(0, 0.00245 1.753%, 0.00994 3.55%, 0.01966 4.916%, 0.03415 6.402%, 0.05334 7.836%, 0.07376 9.061%, 0.10031 10.32%, 0.12808 11.414%, 0.19399 13.366%, 0.27138 14.974%, 0.34403 16.052%, 0.47679 17.475%, 0.54434 18.338%, 0.60689 19.389%, 0.66036 20.609%, 0.71671 22.4%, 0.76532 24.589%, 0.78755 25.874%, 0.80828 27.285%, 0.84475 30.42%, 0.86492 32.632%, 0.88332 35.056%, 0.9002 37.721%, 0.91554 40.622%, 0.9295 43.795%, 0.94208 47.239%, 0.95333 50.97%, 0.96327 54.986%, 0.9795 64.011%, 0.99095 74.434%, 0.99774 86.373%, 1);
    }
  }
  .card.card-sm {
    --_card-gutter-x: .5rem;
    --_card-gutter-y: .5rem;
  }
  .card.card-sm .card-body {
    padding-block: var(--_card-gutter-y);
  }
  .card.card-sm:is(.card-selectable) {
    --_card-selectable-translate: 0 -.25rem;
  }
  .card.card-xs {
    --_card-gutter-x: .75rem;
    --_card-gutter-y: .55rem;
    display: inline-flex;
  }
  .card.card-xs .card-body {
    display: flex;
    align-items: center;
    gap: 0.35rem;
  }
  .card.card-xs .card-body i {
    font-size: 18px;
    font-variation-settings: var(--iw-semi-bold);
  }
  .card.card-xs .card-body p {
    font-weight: 800;
    margin-bottom: 0;
  }
  .card.card-md {
    min-height: 7.5rem;
  }
  .card.card-md .card-body {
    height: 100%;
    align-content: center;
  }
}
@layer components.dialog {
  .dialog {
    --_dialog-radius: 6px;
    --_dialog-gutter: calc(1rem * 1.25);
    --_dialog-max-size: 90%;
    --_discrete: allow-discrete;
    --_dialog-easing-in: cubic-bezier(0.05, 0.7, 0.1, 1);
    --_dialog-easing-out: cubic-bezier(0.4, 0, 1, 1);
    --_dialog-easing-duration: 600ms;
    --_dialog-easing-out-duration: 300ms;
    position: fixed;
    inset: 0;
    padding: 0;
    width: 80vh;
    height: 70vh;
    max-width: var(--_dialog-max-size);
    max-height: var(--_dialog-max-size);
    z-index: 999;
    border: none;
    background-color: var(--theme-surface-body-pane);
    box-shadow: var(--shadow-xl);
  }
  .dialog .dialog-content {
    display: flex;
    flex-direction: column;
    flex-basis: auto;
    flex-wrap: nowrap;
    height: 100%;
    min-height: 100%;
    padding: calc(var(--_dialog-gutter) / 1.25);
    overscroll-behavior: contain;
    text-align: start;
  }
  .dialog .dialog-content .dialog-header {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    word-break: break-word;
    align-items: center;
  }
  .dialog .dialog-content .dialog-header :where(p):is(.dialog-title) {
    color: var(--theme-on-primary);
    font-family: "Geist", "Roboto", -apple-system, "Segoe UI", sans-serif;
    font-weight: 800;
    font-size: var(--fs-600);
    margin-bottom: 0.25rem;
  }
  .dialog .dialog-content .dialog-header :where(p):is(.dialog-subtitle) {
    color: var(--theme-muted-a10);
    font-weight: 500;
    font-size: var(--fs-sm-300);
    margin-bottom: 0;
  }
  .dialog .dialog-content .dialog-header:is(:empty) {
    display: none;
  }
  .dialog .dialog-content .dialog-body {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    margin-block: calc(var(--_dialog-gutter) * 1);
    color: var(--theme-on-primary);
  }
  .dialog .dialog-content .dialog-body p {
    color: var(--theme-on-primary);
  }
  .dialog .dialog-content .dialog-body p:is(.dialog-highlight) {
    position: relative;
    padding-left: 0.75rem;
    font-family: "Geist", "Roboto", -apple-system, "Segoe UI", sans-serif;
    font-weight: 800;
    margin-block: 1.25rem;
  }
  .dialog .dialog-content .dialog-body p:is(.dialog-highlight):first-child {
    margin-block: 0 1.25rem;
  }
  .dialog .dialog-content .dialog-body p:is(.dialog-highlight):before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 0.35rem;
    height: 100%;
    border-radius: 12px;
    background: -webkit-linear-gradient(135deg, #c11ceb, #6f19b5, #25007a);
    background: linear-gradient(135deg, #c11ceb, #6f19b5, #25007a);
  }
  .dialog .dialog-content .dialog-body:is(:empty) {
    display: none;
  }
  .dialog .dialog-content .dialog-footer {
    display: inline-flex;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: flex-end;
    gap: calc(var(--_dialog-gutter) / 2);
  }
  .dialog .dialog-content .dialog-footer .btn {
    padding-inline: 1rem;
    margin-inline: 0;
  }
  .dialog .dialog-content .dialog-footer:is(:empty) {
    display: none;
  }
  .dialog.dialog-modal {
    border-radius: var(--_dialog-radius);
    /* 0. Not visible default state */
    scale: 0;
    translate: 0 -3rem;
    transform-origin: center;
    /* 2. On appear transition */
    /* 1. Before appear on screen */
    /* 2.5. Animation fallback */
  }
  .dialog.dialog-modal, .dialog.dialog-modal::backdrop {
    opacity: 0;
    transition: overlay 150ms var(--_discrete), display 600ms var(--_discrete), scale var(--_dialog-easing-duration), translate var(--_dialog-easing-duration), opacity calc(var(--_dialog-easing-duration) / 3);
    transition-timing-function: var(--_dialog-easing-in);
  }
  @supports (transition: all 100ms linear(1, 1, 1)) {
    .dialog.dialog-modal {
      --_dialog-easing-in: linear(0, 0.00245 1.753%, 0.00994 3.55%, 0.01966 4.916%, 0.03415 6.402%, 0.05334 7.836%, 0.07376 9.061%, 0.10031 10.32%, 0.12808 11.414%, 0.19399 13.366%, 0.27138 14.974%, 0.34403 16.052%, 0.47679 17.475%, 0.54434 18.338%, 0.60689 19.389%, 0.66036 20.609%, 0.71671 22.4%, 0.76532 24.589%, 0.78755 25.874%, 0.80828 27.285%, 0.84475 30.42%, 0.86492 32.632%, 0.88332 35.056%, 0.9002 37.721%, 0.91554 40.622%, 0.9295 43.795%, 0.94208 47.239%, 0.95333 50.97%, 0.96327 54.986%, 0.9795 64.011%, 0.99095 74.434%, 0.99774 86.373%, 1);
      --_dialog-easing-duration: 800ms;
    }
  }
  .dialog.dialog-modal[open] {
    scale: 1;
    translate: 0 0;
    opacity: 1;
  }
  .dialog.dialog-modal[open]::backdrop {
    opacity: 1;
  }
  @starting-style {
    .dialog.dialog-modal[open], .dialog.dialog-modal[open]::backdrop {
      opacity: 0;
    }
    .dialog.dialog-modal[open] {
      scale: 0.9;
      translate: 0 -1.5rem;
    }
  }
  @supports not (transition-behavior: allow-discrete) {
    .dialog.dialog-modal {
      animation: fade-in-down 300ms ease-in-out both;
      animation-timing-function: var(--_dialog-easing-in);
    }
  }
  .dialog.dialog-side-sheet {
    --_dialog-radius: 25px 0 0 25px;
    inset: unset;
    top: 0;
    right: 0;
    width: 18rem;
    height: 100%;
    max-height: 100%;
    border-radius: var(--_dialog-radius);
    /* 0. Not visible default state */
    translate: 15rem 0;
    transform-origin: center right;
    /* 1. Before appear on screen */
    /* 2.5. Animation fallback */
  }
  .dialog.dialog-side-sheet, .dialog.dialog-side-sheet::backdrop {
    opacity: 0;
    transition: overlay 150ms var(--_discrete), display 350ms var(--_discrete), translate var(--_dialog-easing-duration), opacity calc(var(--_dialog-easing-duration));
    transition-timing-function: var(--_dialog-easing-in);
  }
  @supports (transition: all 100ms linear(1, 1, 1)) {
    .dialog.dialog-side-sheet {
      --_dialog-easing-in: linear(0 0%, 0.0027 3.64%, 0.0106 7.29%, 0.0425 14.58%, 0.0957 21.87%, 0.1701 29.16%, 0.2477 35.19%, 0.3401 41.23%, 0.5982 55.18%, 0.7044 61.56%, 0.7987 68.28%, 0.875 75%, 0.9297 81.25%, 0.9687 87.5%, 0.9922 93.75%, 1 100%);
      --_dialog-easing-duration: 350ms;
    }
  }
  .dialog.dialog-side-sheet[open] {
    /* 2. On appear transition */
    translate: 0 0;
    opacity: 1;
  }
  .dialog.dialog-side-sheet[open]::backdrop {
    opacity: 1;
  }
  @starting-style {
    .dialog.dialog-side-sheet[open], .dialog.dialog-side-sheet[open]::backdrop {
      opacity: 0.85;
    }
    .dialog.dialog-side-sheet[open] {
      translate: 15rem 0;
    }
  }
  @supports not (transition-behavior: allow-discrete) {
    .dialog.dialog-side-sheet {
      animation: opacity-in 300ms ease-in-out both;
      animation-timing-function: var(--_dialog-easing-duration);
    }
  }
  .dialog.dialog-side-sheet .dialog-content .dialog-footer :nth-child(1 of .btn) {
    padding-inline: 1rem;
    flex: 1;
    order: 0;
  }
  .dialog.dialog-confirm {
    border-radius: var(--_dialog-radius);
    width: clamp(20rem, 90%, 25rem);
    height: fit-content;
  }
  .dialog.dialog-confirm .dialog-body {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: repeat(3, auto);
    place-content: center;
  }
  .dialog.dialog-confirm .dialog-body i {
    font-size: var(--fs-200);
    font-variation-settings: var(--iw-semi-bold);
    margin-bottom: 1rem;
  }
  .dialog.dialog-confirm .dialog-body p {
    line-height: 1.25;
  }
  .dialog.dialog-confirm .dialog-body p:not(.text-muted) {
    font-size: var(--fs-400);
    font-family: "Geist", "Roboto", -apple-system, "Segoe UI", sans-serif;
    font-weight: 800;
    margin-bottom: 1rem;
  }
  .dialog.dialog-sm {
    width: 50vh;
    height: fit-content;
  }
  .dialog.dialog-md {
    width: 70vh;
    height: 60vh;
  }
  .dialog.dialog-headless .dialog-content .dialog-header {
    flex-wrap: nowrap;
    gap: 0.75rem;
    text-align: start;
    justify-content: flex-start;
    width: 100%;
    padding-top: calc(var(--_dialog-gutter) - 0.55rem);
  }
  .dialog.dialog-headless .dialog-content .dialog-header i {
    padding: 10px;
    border-radius: 8px;
    color: hsl(100, 100%, 100%);
    background-color: var(--theme-secondary-a10);
  }
  .dialog.dialog-cols-2 .dialog-content {
    display: grid;
    grid-template-columns: 0.75fr 1fr;
    gap: var(--_dialog-gutter);
  }
  .dialog.dialog-cols-2 .dialog-content .dialog-banner {
    --gradient-angle: 135deg;
    border-radius: calc(var(--_dialog-radius) / 2);
    animation: angle-spin 10s linear infinite;
    background: -webkit-linear-gradient(var(--gradient-angle), var(--theme-on-primary), #009f42);
    background: linear-gradient(var(--gradient-angle), var(--theme-on-primary), #009f42);
  }
  .dialog.dialog-cols-2 .dialog-content .dialog-header {
    text-align: start;
  }
  .dialog.dialog-cols-2 .dialog-content .dialog-body {
    flex: 1 1 auto;
  }
  .dialog.dialog-cols-2 .dialog-content .dialog-footer {
    display: flex;
  }
  .dialog.dialog-cols-2 .dialog-content .dialog-footer .btn {
    flex: 1 1 auto;
  }
  .dialog::backdrop {
    background: rgba(0, 0, 0, 0.5);
  }
}
@layer components.dropdown {
  .v-popper:is(.v-popper--theme-dropdown) {
    display: inline-block;
  }
  .v-popper:is(.v-popper--theme-dropdown).v-popper--theme-dropdown:is(.v-popper--shown) .btn i:is(.i-search) {
    rotate: 180deg;
  }
  .v-popper__popper {
    --_dropdown-bg-color: var(--theme-surface-container-high);
    --_dropdown-color: var(--theme-on-primary);
    --_dropdown-padding: 12px 0;
    --_dropdown-shadow: var(--shadow-lg);
    --_dropdown-border-radius: 8px;
    --_dropdown-easing-in: cubic-bezier(0.05, 0.7, 0.1, 1);
    --_dropdown-easing-out: cubic-bezier(0.4, 0, 1, 1);
    --_dropdown-easing-duration: 400ms;
    --_dropdown-item-gutter-x: 1rem;
    --_dropdown-item-gutter-y: .5rem;
  }
  @supports (transition: all 100ms linear(1, 1, 1)) {
    .v-popper__popper {
      --_dropdown-easing-in: linear(0, 0.00245 1.753%, 0.00994 3.55%, 0.01966 4.916%, 0.03415 6.402%, 0.05334 7.836%, 0.07376 9.061%, 0.10031 10.32%, 0.12808 11.414%, 0.19399 13.366%, 0.27138 14.974%, 0.34403 16.052%, 0.47679 17.475%, 0.54434 18.338%, 0.60689 19.389%, 0.66036 20.609%, 0.71671 22.4%, 0.76532 24.589%, 0.78755 25.874%, 0.80828 27.285%, 0.84475 30.42%, 0.86492 32.632%, 0.88332 35.056%, 0.9002 37.721%, 0.91554 40.622%, 0.9295 43.795%, 0.94208 47.239%, 0.95333 50.97%, 0.96327 54.986%, 0.9795 64.011%, 0.99095 74.434%, 0.99774 86.373%, 1);
      --_dropdown-easing-duration: 400ms;
    }
  }
  .v-popper__popper.v-popper--theme-dropdown {
    isolation: isolate;
    position: relative;
    transform-origin: center;
  }
  .v-popper__popper.v-popper--theme-dropdown .v-popper__wrapper .v-popper__inner {
    background-color: var(--_dropdown-bg-color);
    color: var(--_dropdown-color);
    padding: var(--_dropdown-padding);
    box-shadow: var(--shadow-lg);
    border-radius: var(--_dropdown-border-radius);
    border: none;
  }
  .v-popper__popper.v-popper--theme-dropdown .v-popper__wrapper .v-popper__inner kbd {
    background-color: var(--theme-surface-kbd);
    border: 1px solid var(--theme-surface-kbd);
    color: var(--theme-on-primary-inverse);
    font-weight: 800;
  }
  .v-popper__popper.v-popper--theme-dropdown .v-popper__wrapper .v-popper__inner ul {
    list-style: none;
    margin-block: 0;
    padding-left: 0;
  }
  .v-popper__popper.v-popper--theme-dropdown .v-popper__wrapper .v-popper__inner ul li {
    list-style: none;
  }
  .v-popper__popper.v-popper--theme-dropdown .v-popper__wrapper .v-popper__inner ul li .v-dropdown-item {
    font-weight: 600;
    background: inherit;
    color: var(--_dropdown-color);
    padding-block: var(--_dropdown-item-gutter-y);
    padding-left: var(--_dropdown-item-gutter-x);
    padding-right: calc(var(--_dropdown-item-gutter-x) * 1.5);
    border: none;
    border-radius: 6px;
    font-family: "Geist", "Roboto", -apple-system, "Segoe UI", sans-serif;
    font-size: var(--fs-sm-500);
    text-align: left;
    width: 100%;
    cursor: pointer;
  }
  .v-popper__popper.v-popper--theme-dropdown .v-popper__wrapper .v-popper__inner ul li .v-dropdown-item.v-text-item {
    display: inline-block;
    color: var(--theme-muted-a10);
    padding-block: 4px;
    border-radius: 0px;
    font-size: var(--fs-sm-400);
  }
  .v-popper__popper.v-popper--theme-dropdown .v-popper__wrapper .v-popper__inner ul li .v-dropdown-item.v-text-item:is(:hover, :focus, :active) {
    background-color: inherit;
    color: inherit;
    cursor: default;
  }
  .v-popper__popper.v-popper--theme-dropdown .v-popper__wrapper .v-popper__inner ul li .v-dropdown-item:is(a, span) {
    display: inline-block;
  }
  .v-popper__popper.v-popper--theme-dropdown .v-popper__wrapper .v-popper__inner ul li .v-dropdown-item .badge {
    --_badge-font-size: 8px;
    --_badge-gutter-y: 0.25rem;
    --_badge-gutter-x: 0.375rem;
    margin-left: 0.35rem;
    line-height: 1.25;
  }
  .v-popper__popper.v-popper--theme-dropdown .v-popper__wrapper .v-popper__inner ul li .v-dropdown-item i {
    font-size: 16px;
    font-variation-settings: var(--iw-semi-bold);
    margin-right: 0.35rem;
  }
  .v-popper__popper.v-popper--theme-dropdown .v-popper__wrapper .v-popper__inner ul li .v-dropdown-item:is(.v-danger) i {
    color: var(--theme-danger-a10);
  }
  .v-popper__popper.v-popper--theme-dropdown .v-popper__wrapper .v-popper__inner ul li .v-dropdown-item:is(.v-disabled) {
    color: var(--theme-muted-a10);
  }
  .v-popper__popper.v-popper--theme-dropdown .v-popper__wrapper .v-popper__inner ul li .v-dropdown-item:is(.v-disabled) i {
    color: inherit;
  }
  .v-popper__popper.v-popper--theme-dropdown .v-popper__wrapper .v-popper__inner ul li .v-dropdown-item:is(:hover) {
    background-color: var(--theme-surface-container-highest);
    color: var(--theme-on-primary);
  }
  .v-popper__popper.v-popper--theme-dropdown .v-popper__wrapper .v-popper__inner ul li .v-dropdown-item:is(:focus, :active, .active) {
    background-color: var(--theme-surface-a60);
    color: var(--theme-on-primary);
  }
  .v-popper__popper.v-popper--theme-dropdown .v-popper__wrapper .v-popper__inner ul li .v-dropdown-item:is(.disabled) {
    background-color: rgba(var(--theme-muted-rgba), 15%);
    color: var(--theme-muted-a10);
  }
  .v-popper__popper.v-popper--theme-dropdown .v-popper__wrapper .v-popper__inner ul li.v-dropdown-divider {
    height: 0;
    margin: 0.25rem;
    overflow: hidden;
    border-top: 1px solid rgba(var(--theme-muted-rgba), 50%);
    opacity: 1;
  }
  .v-popper__popper.v-popper--theme-dropdown .v-popper__wrapper .v-popper__arrow-container .v-popper__arrow-outer, .v-popper__popper.v-popper--theme-dropdown .v-popper__wrapper .v-popper__arrow-container .v-popper__arrow-inner {
    visibility: hidden;
  }
  .v-popper__popper.v-popper--theme-dropdown.v-popper__popper--hidden {
    visibility: hidden;
    opacity: 0;
    translate: 0 -3rem;
    transition: translate calc(var(--_dropdown-easing-duration) / 3) var(--_dropdown-easing-out), opacity calc(var(--_dropdown-easing-duration) / 2), visibility calc(var(--_dropdown-easing-duration) / 2);
    transform-origin: center;
  }
  .v-popper__popper.v-popper--theme-dropdown.v-popper__popper--shown {
    visibility: visible;
    opacity: 1;
    translate: 0;
    transition: translate var(--_dropdown-easing-duration) var(--_dropdown-easing-in), opacity var(--_dropdown-easing-duration), visibility var(--_dropdown-easing-duration);
    transform-origin: center;
  }
  .v-popper__popper.v-popper--theme-dropdown.v-popper__popper--no-positioning {
    --_dropdown-easing-duration: 300ms;
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: flex-end;
    overscroll-behavior: contain;
    z-index: 999;
  }
  .v-popper__popper.v-popper--theme-dropdown.v-popper__popper--no-positioning .v-popper__backdrop {
    display: block;
    background: rgba(var(--theme-overlay-rgba), 50%);
  }
  .v-popper__popper.v-popper--theme-dropdown.v-popper__popper--no-positioning .v-popper__wrapper {
    width: 100%;
    pointer-events: auto;
  }
  .v-popper__popper.v-popper--theme-dropdown.v-popper__popper--no-positioning .v-popper__wrapper .v-popper__inner {
    border-radius: 12px 12px 0 0;
    padding-block: 12px 24px;
  }
  .v-popper__popper.v-popper--theme-dropdown.v-popper__popper--no-positioning .v-popper__wrapper .v-popper__inner ul li .v-dropdown-item {
    padding-block: 12px;
    font-size: 12px;
  }
  .v-popper__popper.v-popper--theme-dropdown.v-popper__popper--no-positioning .v-popper__wrapper .v-popper__inner ul li .v-dropdown-item i {
    font-variation-settings: var(--iw-semi-bold);
  }
  .v-popper__popper.v-popper--theme-dropdown.v-popper__popper--no-positioning.v-popper__popper--hidden {
    translate: 0;
  }
  .v-popper__popper.v-popper--theme-dropdown.v-popper__popper--no-positioning.v-popper__popper--hidden .v-popper__wrapper {
    translate: 0 50vh;
    transition: translate calc(var(--_dropdown-easing-duration) / 2) var(--_dropdown-easing-out), opacity 100ms ease-in-out, visibility 100ms ease-in-out;
  }
  .v-popper__popper.v-popper--theme-dropdown.v-popper__popper--no-positioning.v-popper__popper--shown {
    translate: 0;
  }
  .v-popper__popper.v-popper--theme-dropdown.v-popper__popper--no-positioning.v-popper__popper--shown .v-popper__wrapper {
    translate: 0;
    transition: translate var(--_dropdown-easing-duration) var(--_dropdown-easing-in), opacity 100ms ease-in-out, visibility 100ms ease-in-out;
  }
}
@layer components.image {
  .img-fluid {
    border-radius: 6px;
    max-width: 100%;
    height: auto;
  }
  .img-avatar {
    --_img-avatar-radius: 50px;
    --_img-avatar-easing-in: cubic-bezier(0.05, 0.7, 0.1, 1);
    --_img-avatar-easing-duration: 200ms;
    aspect-ratio: 1;
    border-radius: var(--_img-avatar-radius);
    object-fit: cover;
    transition: border-radius var(--_img-avatar-easing-duration) var(--_img-avatar-easing-in), translate var(--_img-avatar-easing-duration) var(--_img-avatar-easing-in);
    width: 100px;
    height: 100px;
  }
  @supports (transition: linear(0, 0, 0)) {
    .img-avatar {
      --_img-avatar-easing-in: linear(0, 0.00217 0.5%, 0.00866 1.01%, 0.0346 2.07%, 0.0782 3.2%, 0.14066 4.43%, 0.28086 6.651%, 0.72289 12.911%, 0.84164 14.861%, 0.93834 16.722%, 1.01676 18.572%, 1.07743 20.432%, 1.12131 22.332%, 1.1373 23.312%, 1.14934 24.312%, 1.15904 25.603%, 1.16294 26.953%, 1.16113 28.383%, 1.15356 29.933%, 1.14335 31.273%, 1.12887 32.783%, 1.05059 39.614%, 1.01677 43.094%, 1.00206, 0.99057 46.975%, 0.98215 48.945%, 0.9766 50.995%, 0.9735 53.835%, 0.97488 57.056%, 0.9966 69.827%, 1.00329 76.878%, 1.00417 83.808%, 0.99996);
      --_img-avatar-easing-duration: 600ms;
    }
  }
  .img-avatar.avatar-placeholder {
    display: inline-block;
    background: -webkit-linear-gradient(45deg, #5300fa, #ab068e, #ee5aaf);
    background: linear-gradient(45deg, #5300fa, #ab068e, #ee5aaf);
    width: 35px;
    height: 35px;
  }
  .img-avatar.avatar-sm {
    position: relative;
    width: 24px;
    height: 24px;
  }
  .img-avatar.avatar-md {
    position: relative;
    border: calc(2px * 2) solid var(--theme-background);
    width: 100px;
    height: 100px;
  }
  .img-avatar.avatar-lg {
    position: relative;
    width: 150px;
    height: 150px;
  }
  .img-avatar.avatar-navbar {
    width: 35px;
    height: 35px;
  }
  .img-avatar.avatar-menu {
    width: 50px;
    height: 50px;
  }
  .img-fit-cover {
    object-fit: cover;
  }
  .img-fit-contain {
    object-fit: contain;
  }
  .img-fit-fill {
    object-fit: fill;
  }
}
@layer components.list {
  .list-group {
    --_list-group-item-bg-color: var(--theme-surface-container);
    --_list-group-item-border-color: transparent;
    --_list-group-item-color: var(--theme-on-primary);
    --_list-group-item-color-subtitle: var(--theme-muted-a10);
    --_list-group-item-icon-bg-color: var(--theme-surface-container-lowest);
    --_list-group-item-icon-color: var(--theme-on-primary);
    --_list-group-item-radius: 12px;
    display: grid;
    grid-template-rows: auto;
    gap: 0.35rem;
    width: 100%;
    padding: 0;
    margin: 0;
    list-style: none;
    background: transparent;
  }
  .list-group .list-group-item {
    width: 100%;
    background-color: var(--_list-group-item-bg-color);
    border: 1px solid var(--_list-group-item-border-color);
    border-radius: var(--_list-group-item-radius);
    transition: cubic-bezier(0.05, 0.7, 0.1, 1);
  }
  .list-group .list-group-item:is(:first-child) {
    --_list-group-radius: 12px 12px 6px 6px;
  }
  .list-group .list-group-item:is(:last-child) {
    --_list-group-radius: 6px 6px 12px 12px;
  }
  .list-group .list-group-item:not(:first-child, :last-child) {
    --_list-group-radius: 8px;
  }
  .list-group .list-group-item .list-item {
    --_list-item-gap: 0.85rem;
    --_list-item-padding: 0.55rem;
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: var(--_list-item-gap);
    padding: var(--_list-item-padding);
    border-radius: var(--_list-group-item-radius);
    width: 100%;
  }
  .list-group .list-group-item .list-item p:is(.subtitle-1) {
    font-family: "Geist", "Roboto", -apple-system, "Segoe UI", sans-serif;
    font-weight: 600;
    font-size: var(--fs-sm-400);
    color: var(--_list-group-item-color);
    margin-bottom: 0;
  }
  .list-group .list-group-item .list-item p:is(.subtitle-2) {
    font-size: var(--fs-sm-400);
    color: var(--_list-group-item-color-subtitle);
    margin-block: 0;
  }
  .list-group .list-group-item .list-item:is(a) {
    cursor: pointer;
  }
  .list-group .list-group-item .list-item .list-item-icon-wrapper {
    border-radius: 8px;
    padding: 0.625rem;
    aspect-ratio: 1;
    background-color: var(--_list-group-item-icon-bg-color);
  }
  .list-group .list-group-item .list-item .list-item-icon-wrapper i {
    font-size: var(--fs-500);
    color: var(--_list-group-item-icon-color);
  }
  .list-group .list-group-item.list-item-active {
    --_list-group-item-bg-color: var(--theme-surface-container-high);
    --_list-group-item-border-color: var(--theme-primary-a10);
    --_list-group-item-icon-bg-color: var(--theme-primary-a90);
    --_list-group-item-icon-color: var(--theme-on-primary-inverse);
    z-index: 2;
    border-width: 2px;
  }
  .list-group .list-group-item.list-item-disabled {
    --_list-group-item-bg-color: var(--theme-surface-disabled);
    --_list-group-item-border-color: var(--theme-surface-disabled);
    --_list-group-item-color: var(--theme-muted-a10);
    --_list-group-item-color-subtitle: var(--theme-muted-a10);
    --_list-group-item-icon-bg-color: var(--theme-surface-disabled);
    --_list-group-item-icon-color: var(--theme-muted-a10);
    cursor: not-allowed;
  }
  .list-group.list-group-sm .list-group-item .list-item {
    --_list-item-gap: 0.45rem;
    --_list-item-padding: 0.35rem;
  }
  .list-group.list-group-md .list-group-item .list-item {
    --_list-item-gap: 0.65rem;
    --_list-item-padding: 0.45rem;
  }
  .list-group.list-group-flush {
    --_list-group-item-bg-color: transparent;
    --_list-group-item-border-color: var(--theme-outline-surface);
    --_list-group-item-radius: 0px;
    gap: 0;
  }
  .list-group.list-group-flush .list-group-item {
    border: red;
    border-bottom: 1px solid var(--_list-group-item-border-color);
  }
  .list-group.list-group-flush .list-group-item:last-child {
    border-bottom: transparent;
  }
  .list-group.list-group-low-contrast {
    --_list-group-item-bg-color: var(--theme-surface-container-low);
    --_list-group-item-icon-bg-color: var(--theme-surface-body-pane);
  }
  .list-group.list-group-interactive .list-group-item {
    cursor: pointer;
    user-select: none;
  }
  .list-group.list-group-interactive .list-group-item:is(:hover) {
    --_list-group-item-bg-color: var(--theme-surface-container-high);
  }
  .list-group.list-group-interactive .list-group-item:is(:active, :focus) {
    --_list-group-item-bg-color: var(--theme-surface-container-highest);
  }
}
@layer components.prime {
  .p-multiselect {
    --p-multiselect-background: transparent;
    --p-multiselect-border-color: var(--theme-outline-text-field);
    --p-multiselect-border-radius: 8px;
    --p-multiselect-shadow: none;
    background: inherit;
    border: inherit;
    border-radius: inherit;
  }
  .p-multiselect .p-multiselect-label-container {
    display: flex;
    align-items: center;
    height: 100%;
    font-size: 14px;
  }
  .p-multiselect .p-multiselect-label-container .p-placeholder {
    --p-multiselect-placeholder-color: color-mix(in srgb, var(--theme-muted-a10), transparent 35%);
  }
  .p-multiselect .p-multiselect-trigger {
    display: none;
  }
  .p-multiselect-overlay {
    --p-multiselect-overlay-background: var(--theme-surface-container);
    --p-multiselect-overlay-color: var(--theme-on-primary);
    --p-multiselect-overlay-border-color: var(--theme-outline-surface);
    --p-multiselect-overlay-border-radius: 8px;
    --p-multiselect-overlay-shadow: var(--shadow-md);
    margin-top: 0.35rem;
  }
  .p-multiselect-overlay .p-multiselect-header {
    --p-multiselect-list-header-padding: .15rem;
    display: none;
  }
  .p-multiselect-overlay .p-multiselect-header .p-checkbox {
    --p-checkbox-width: fit-content;
    --p-checkbox-height: fit-content;
    display: none !important;
  }
  .p-multiselect-overlay .p-multiselect-header .p-multiselect-filter-container {
    --p-form-field-padding-x: .5rem;
    --p-icon-size: .75rem;
    --p-iconfield-icon-color: var(--theme-muted-a10);
  }
  .p-multiselect-overlay .p-multiselect-header .p-multiselect-filter-container .p-inputtext {
    --p-inputtext-color: var(--theme-on-primary);
    --p-inputtext-background: transparent;
    --p-inputtext-border-color: transparent;
    --p-inputtext-padding-y: .35rem;
    --p-inputtext-padding-x: .35rem;
    --p-inputtext-border-radius: calc(6px / 1.25);
    --p-inputtext-shadow: none;
    font-size: var(--fs-sm-300) !important;
  }
  .p-multiselect-overlay .p-multiselect-list-container .p-multiselect-list {
    --p-multiselect-list-gap: .35rem;
    --p-multiselect-list-padding: .15rem;
  }
  .p-multiselect-overlay .p-multiselect-list-container .p-multiselect-list .p-multiselect-option {
    --p-multiselect-option-gap: .25rem;
    --p-multiselect-option-padding: .35rem;
    --p-multiselect-option-color: var(--theme-on-primary);
    --p-multiselect-option-border-radius: 6px;
    font-size: var(--fs-sm-300);
  }
  .p-multiselect-overlay .p-multiselect-list-container .p-multiselect-list .p-multiselect-option .p-checkbox {
    display: none !important;
  }
  .p-multiselect-overlay .p-multiselect-list-container .p-multiselect-list .p-multiselect-option:is(:hover) {
    background: var(--theme-surface-container-high);
  }
  .p-multiselect-overlay .p-multiselect-list-container .p-multiselect-list .p-multiselect-option.p-focus {
    --p-multiselect-option-focus-background: var(--theme-surface-container-high);
    --p-multiselect-option-focus-color: var(--theme-primary-a30);
  }
  .p-multiselect-overlay .p-multiselect-list-container .p-multiselect-list .p-multiselect-option:has(.p-checkbox-checked) {
    color: var(--theme-primary-a90) !important;
    background: var(--theme-surface-container-highest) !important;
  }
  .p-multiselect-overlay .p-multiselect-list-container .p-multiselect-list .p-multiselect-empty-message {
    --p-multiselect-empty-message-padding: .35rem;
    color: var(--theme-muted-a10);
    font-size: var(--fs-sm-300);
  }
  .p-dropdown .p-dropdown-label {
    display: flex;
    height: 100%;
    width: 100%;
    font-size: 14px;
    border: 0;
    background: transparent;
    color: var(--theme-on-primary);
  }
  .p-dropdown .p-dropdown-label::placeholder {
    color: color-mix(in srgb, var(--theme-muted-a10), transparent 35%);
  }
  .p-dropdown .p-dropdown-trigger {
    display: none;
  }
  .p-dropdown-panel {
    background: var(--theme-surface-container);
    border-radius: 12px;
    margin-top: 0.5rem;
    padding: 0.25rem;
  }
  .p-dropdown-panel .p-dropdown-items {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    padding-left: 0;
    margin-bottom: 0;
  }
  .p-dropdown-panel .p-dropdown-items .p-dropdown-item {
    color: var(--theme-on-primary);
    font-size: var(--fs-sm-200);
    border-radius: 6px;
    padding: 0.35rem 0.5rem;
  }
  .p-dropdown-panel .p-dropdown-items .p-dropdown-item.p-highlight {
    background: var(--theme-surface-container-highest);
  }
  .p-dropdown-panel .p-dropdown-items .p-dropdown-item.p-focus {
    background: var(--theme-surface-container-high);
  }
  .p-dropdown-panel .p-dropdown-items .p-dropdown-item:hover {
    background: var(--theme-surface-container-high);
  }
  .p-colorpicker {
    --_size: 1.75rem;
  }
  .p-colorpicker.p-colorpicker-overlay {
    display: inline-flex;
    width: auto;
  }
  .p-colorpicker .p-colorpicker-preview {
    width: var(--_size);
    height: var(--_size);
    border-radius: 6px;
    border: 1px solid transparent;
  }
  .p-colorpicker-panel {
    background: var(--theme-surface-container-highest);
    border-radius: calc(6px + 8px);
    padding: 1rem;
    box-shadow: var(--shadow-md);
  }
  .p-colorpicker-panel .p-colorpicker-color-selector {
    border-radius: 6px;
  }
  .p-colorpicker-panel .p-colorpicker-color-selector .p-colorpicker-color {
    border-radius: inherit;
  }
  .p-colorpicker-panel .p-colorpicker-hue {
    border-radius: 25px;
  }
  .p-toast {
    --_margin: .5rem;
  }
  .p-toast .p-toast-message {
    background: var(--theme-surface-toast);
    border-radius: 8px;
    padding: 0.85rem;
  }
  .p-toast .p-toast-message .p-toast-message-content {
    display: flex;
    align-items: flex-start;
  }
  .p-toast .p-toast-message .p-toast-message-content .p-toast-container {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    flex: 1 1 auto;
  }
  .p-toast .p-toast-message .p-toast-message-content .p-toast-container p {
    color: var(--theme-on-primary-inverse);
  }
  .p-toast .p-toast-message .p-toast-message-content .p-toast-container p.subtitle-1 {
    font-weight: 800;
    font-family: "Mona Sans", "Roboto", -apple-system, "Segoe UI", sans-serif;
    font-size: var(--fs-500);
    margin-bottom: var(--_margin);
  }
  .p-toast .p-toast-message .p-toast-message-content .p-toast-container p.subtitle-2 {
    margin-bottom: var(--_margin);
  }
  .p-toast .p-toast-message .p-toast-message-content .p-toast-container .btn {
    align-self: inherit;
  }
  .p-toast .p-toast-message .p-toast-icon-close {
    fill: var(--theme-on-primary-inverse);
  }
  .p-confirm-dialog {
    background-color: var(--theme-surface-container-highest);
    border-radius: calc(25px + 3px);
    box-shadow: var(--shadow-xl);
    display: flex;
    flex-direction: column;
    pointer-events: auto;
    padding: 1.5rem;
    gap: 1.5rem;
    width: 50vh;
    min-width: 40vh;
    max-height: 70vh;
  }
  .p-confirm-dialog .p-dialog-header {
    display: flex;
  }
  .p-confirm-dialog .p-dialog-header .p-dialog-title {
    font-family: "Mona Sans", "Roboto", -apple-system, "Segoe UI", sans-serif;
    font-weight: 800;
    font-size: var(--fs-500);
    color: var(--theme-on-primary);
    margin-bottom: 0;
  }
  .p-confirm-dialog .p-dialog-header .p-dialog-header-close-icon {
    filter: var(--theme-img-logo);
  }
  .p-confirm-dialog .p-dialog-content .p-confirm-dialog-message {
    font-weight: 500;
    color: var(--theme-muted-a10);
    margin-bottom: 0;
    letter-spacing: 0.15px;
    text-wrap: balance;
  }
  @supports (text-wrap: pretty) {
    .p-confirm-dialog .p-dialog-content .p-confirm-dialog-message {
      text-wrap: pretty;
    }
  }
  .p-confirm-dialog .p-dialog-footer {
    display: flex;
    justify-content: flex-end;
  }
  .p-dialog-mask {
    background: rgba(var(--theme-overlay-rgba), 50%);
  }
  .p-inputswitch {
    --_p-switch-easing-in: cubic-bezier(0.05, 0.7, 0.1, 1);
    --_p-switch-easing-duration: 600ms;
    --_p-switch-slider-easing-in: cubic-bezier(0.05, 0.7, 0.1, 1);
    --_p-switch-slider-easing-duration: 300ms;
    width: 3rem;
    height: 1.75rem;
    display: block;
  }
  @supports (transition: all 100ms linear(1, 1, 1)) {
    .p-inputswitch {
      --_p-switch-slider-easing-in: linear(0, 0.00217 0.5%, 0.00866 1.01%, 0.0346 2.07%, 0.0782 3.2%, 0.14066 4.43%, 0.28086 6.651%, 0.72289 12.911%, 0.84164 14.861%, 0.93834 16.722%, 1.01676 18.572%, 1.07743 20.432%, 1.12131 22.332%, 1.1373 23.312%, 1.14934 24.312%, 1.15904 25.603%, 1.16294 26.953%, 1.16113 28.383%, 1.15356 29.933%, 1.14335 31.273%, 1.12887 32.783%, 1.05059 39.614%, 1.01677 43.094%, 1.00206, 0.99057 46.975%, 0.98215 48.945%, 0.9766 50.995%, 0.9735 53.835%, 0.97488 57.056%, 0.9966 69.827%, 1.00329 76.878%, 1.00417 83.808%, 0.99996);
      --_p-switch-slider-easing-duration: 800ms;
    }
  }
  .p-inputswitch .p-inputswitch-input {
    appearance: none;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    padding: 0;
    margin: 0;
    opacity: 0;
    z-index: 1;
    outline: 0 none;
    border-radius: 30px;
  }
  .p-inputswitch .p-inputswitch-slider {
    display: flex;
    align-items: center;
    background-color: var(--theme-surface-a10);
    border-radius: 50px;
    border: 0.115625em solid var(--theme-surface-a60);
    transition: background-color var(--_p-switch-easing-duration) var(--_p-switch-easing-in), color var(--_p-switch-easing-duration) var(--_p-switch-easing-in), border-color var(--_p-switch-easing-duration) var(--_p-switch-easing-in), box-shadow var(--_p-switch-easing-duration) var(--_p-switch-easing-in);
  }
  .p-inputswitch .p-inputswitch-slider:before {
    background-color: var(--theme-surface-a60);
    width: 0.85rem;
    height: 0.85rem;
    left: 0.25rem;
    top: auto;
    border-radius: 50px;
    display: grid;
    place-content: center;
    transition: background-color var(--_p-switch-slider-easing-duration) var(--_p-switch-slider-easing-in), translate var(--_p-switch-slider-easing-duration) var(--_p-switch-slider-easing-in);
  }
  .p-inputswitch.p-highlight .p-inputswitch-slider {
    background-color: var(--theme-success-a10);
    border-color: var(--theme-success-a10);
  }
  .p-inputswitch.p-highlight .p-inputswitch-slider:before {
    background-color: var(--theme-on-primary-inverse);
    translate: 1.15rem 0;
    width: 1.25rem;
    height: 1.25rem;
    content: "check";
    font-family: "Material Symbols Rounded", sans-serif;
    font-variation-settings: var(--iw-semi-bold);
    color: var(--theme-success-a10);
  }
}
@layer components.progress {
  .progress {
    --_progress-bg-color: var(--theme-surface-container-lowest);
    --_progress-color: var(--theme-primary);
    --_progress-on-bg-color: var(--theme-on-primary-container);
    --_progress-height: 0.85rem;
    --_progress-border-radius: 8px;
    --_progress-easing-in: cubic-bezier(0.05, 0.7, 0.1, 1);
    display: flex;
    overflow: hidden;
    height: var(--_progress-height);
    font-size: var(--fs-sm-500);
    font-weight: 600;
    background: var(--_progress-bg-color);
    border-radius: var(--_progress-border-radius);
  }
  @supports (transition: all 100ms linear(1, 1, 1)) {
    .progress {
      --_progress-easing-in: linear(0, 0.00245 1.753%, 0.00994 3.55%, 0.01966 4.916%, 0.03415 6.402%, 0.05334 7.836%, 0.07376 9.061%, 0.10031 10.32%, 0.12808 11.414%, 0.19399 13.366%, 0.27138 14.974%, 0.34403 16.052%, 0.47679 17.475%, 0.54434 18.338%, 0.60689 19.389%, 0.66036 20.609%, 0.71671 22.4%, 0.76532 24.589%, 0.78755 25.874%, 0.80828 27.285%, 0.84475 30.42%, 0.86492 32.632%, 0.88332 35.056%, 0.9002 37.721%, 0.91554 40.622%, 0.9295 43.795%, 0.94208 47.239%, 0.95333 50.97%, 0.96327 54.986%, 0.9795 64.011%, 0.99095 74.434%, 0.99774 86.373%, 1);
      --_progress-easing-duration: 800ms;
    }
  }
  .progress.progress-sm {
    --_progress-height: 0.5rem;
  }
  .progress .progress-bar {
    --_progress-bg-color: var(--theme-primary-a10);
    display: flex;
    flex-direction: column;
    justify-content: center;
    overflow: hidden;
    width: var(--_progress-width, 50%);
    max-width: 100%;
    height: var(--_progress-height);
    text-align: center;
    white-space: nowrap;
    color: var(--_progress-on-bg-color);
    background-color: var(--_progress-bg-color);
    border-radius: inherit;
    transition: width var(--_progress-easing-duration) var(--_progress-easing-in);
  }
  .progress .progress-bar.progress-animated {
    animation: progress-bar-stripes 3s ease-in-out infinite both;
  }
  .progress .progress-bar.progress-gradient.g-primary {
    --_badge-gradient-color: hsl(100, 100%, 100%);
    background-image: linear-gradient(45deg, #0023f7, #382bf0);
    background-image: -webkit-linear-gradient(45deg, #0023f7, #382bf0);
  }
  .progress .progress-bar.progress-gradient.g-gold {
    background-image: linear-gradient(45deg, #875919, #a87732, #dbaa64, #f0c588);
    background-image: -webkit-linear-gradient(45deg, #875919, #a87732, #dbaa64, #f0c588);
  }
  .progress .progress-bar.progress-gradient.g-green {
    background-image: linear-gradient(45deg, #4ae17b, #11d181);
    background-image: -webkit-linear-gradient(45deg, #4ae17b, #11d181);
  }
  .progress .progress-bar.progress-gradient.g-cyan {
    background-image: linear-gradient(45deg, #0adeff, #0a81ff);
    background-image: -webkit-linear-gradient(45deg, #0adeff, #0a81ff);
  }
  .progress .progress-bar.progress-gradient.g-yellow {
    background-image: linear-gradient(45deg, #ffe572, #c28333);
    background-image: -webkit-linear-gradient(45deg, #ffe572, #c28333);
  }
  .progress .progress-bar.progress-gradient.g-orange {
    background-image: linear-gradient(45deg, #c20ea1, #dd2d7f, #ee4c5e, #f46d41);
    background-image: -webkit-linear-gradient(45deg, #c20ea1, #dd2d7f, #ee4c5e, #f46d41);
  }
  .progress .progress-bar.progress-gradient.g-purple {
    background-image: linear-gradient(45deg, #c11ceb, #6f19b5, #25007a);
    background-image: -webkit-linear-gradient(45deg, #c11ceb, #6f19b5, #25007a);
  }
  .progress .progress-bar.progress-gradient.g-red {
    background-image: linear-gradient(45deg, #e91e63, #d81557, #aa1145);
    background-image: -webkit-linear-gradient(45deg, #e91e63, #d81557, #aa1145);
  }
  .progress .progress-bar.progress-gradient.g-blue {
    background-image: linear-gradient(45deg, #148ade, #116ab8);
    background-image: -webkit-linear-gradient(45deg, #148ade, #116ab8);
  }
  .progress .progress-bar.progress-gradient.g-black {
    background-image: linear-gradient(45deg, #404040, #212121);
    background-image: -webkit-linear-gradient(45deg, #404040, #212121);
  }
  .progress .progress-bar.progress-gradient.g-indigo {
    background-image: linear-gradient(45deg, #715cff, #6851ff);
    background-image: -webkit-linear-gradient(45deg, #715cff, #6851ff);
  }
  .progress .progress-bar.progress-gradient.g-violet {
    background-image: linear-gradient(45deg, #8200e7, #bf3eff);
    background-image: -webkit-linear-gradient(45deg, #8200e7, #bf3eff);
  }
  .progress .progress-bar.progress-gradient.g-body-primary {
    background-image: linear-gradient(0deg, var(--theme-on-primary), #382bf0);
    background-image: -webkit-linear-gradient(0deg, var(--theme-on-primary), #382bf0);
  }
  .progress .progress-bar.progress-gradient.g-body-secondary {
    background-image: linear-gradient(45deg, var(--theme-on-primary), #ffc107);
    background-image: -webkit-linear-gradient(45deg, var(--theme-on-primary), #ffc107);
  }
  .progress .progress-bar.progress-gradient.g-body-success {
    background-image: linear-gradient(0deg, var(--theme-on-primary), #009f42);
    background-image: -webkit-linear-gradient(0deg, var(--theme-on-primary), #009f42);
  }
  .progress .progress-bar.progress-gradient.g-body-danger {
    background-image: linear-gradient(45deg, var(--theme-on-primary), #b41c2b);
    background-image: -webkit-linear-gradient(45deg, var(--theme-on-primary), #b41c2b);
  }
  .progress-icon {
    --_progress-icon-color: var(--theme-muted-a10);
    --_progress-icon-size: 1.25rem;
    position: relative;
    display: flex;
    margin-bottom: 0.75rem;
    width: var(--_progress-icon-size);
    height: var(--_progress-icon-size);
  }
  .progress-icon:after {
    position: absolute;
    content: "progress_activity";
    font-family: "Material Symbols Rounded", sans-serif;
    font-size: var(--_progress-icon-size);
    color: var(--_progress-icon-color);
    animation: spin 2s linear infinite;
  }
  .placeholder-list {
    position: relative;
    height: 13rem;
    width: 100%;
    background-color: var(--theme-surface-container);
    z-index: 44;
    overflow: hidden;
    border-radius: 0px;
  }
  .placeholder-list .placeholder-loader {
    position: absolute;
    left: -45%;
    height: 100%;
    width: 45%;
    background-image: linear-gradient(to left, rgba(251, 251, 251, 0.05), rgba(251, 251, 251, 0.3), rgba(251, 251, 251, 0.6), rgba(251, 251, 251, 0.3), rgba(251, 251, 251, 0.05));
    background-image: -moz-linear-gradient(to left, rgba(251, 251, 251, 0.05), rgba(251, 251, 251, 0.3), rgba(251, 251, 251, 0.6), rgba(251, 251, 251, 0.3), rgba(251, 251, 251, 0.05));
    background-image: -webkit-linear-gradient(to left, rgba(251, 251, 251, 0.05), rgba(251, 251, 251, 0.3), rgba(251, 251, 251, 0.6), rgba(251, 251, 251, 0.3), rgba(251, 251, 251, 0.05));
    animation: placeholderLoading 1s infinite;
    z-index: 45;
  }
  .placeholder {
    display: inline-block;
    border-radius: 25px;
    background-color: var(--theme-muted-a10);
    opacity: 0.5;
  }
  .placeholder.placeholder-md {
    min-height: 0.75rem;
  }
  .placeholder.placeholder-lg {
    min-height: 2.6rem;
  }
  .spinner {
    animation: rotator 1.4s linear infinite;
  }
  .path {
    stroke-dasharray: 187;
    stroke-dashoffset: 0;
    transform-origin: center;
    animation: dash 1.4s ease-in-out infinite, colors 5.6s ease-in-out infinite;
  }
  @keyframes rotator {
    0% {
      transform: rotate(0deg);
    }
    100% {
      transform: rotate(360deg);
    }
  }
  @keyframes colors {
    0% {
      stroke: #121212;
    }
    25% {
      stroke: #0c8eaf;
    }
    50% {
      stroke: #fda001;
    }
    75% {
      stroke: hsl(40, 100%, 50%);
    }
    100% {
      stroke: hsl(145, 100%, 39%);
    }
  }
  @keyframes dash {
    0% {
      stroke-dashoffset: 187;
    }
    50% {
      stroke-dashoffset: 46.75;
      transform: rotate(135deg);
    }
    100% {
      stroke-dashoffset: 187;
      transform: rotate(450deg);
    }
  }
}
@layer components.tabs {
  .nav {
    --_nav-tabs-gap: .5rem;
    --_nav-tabs-gutter-x: 0;
    --_nav-tabs-gutter-y: .75rem;
    --_nav-tabs-radius: 0px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    gap: var(--_nav-tabs-gap);
    list-style: none;
    padding: 0;
    margin-inline: var(--_nav-tabs-gutter-x);
    margin-block: 0;
    min-width: 100%;
    height: auto;
    background: transparent;
    border-radius: var(--_nav-tabs-radius);
  }
  .nav.nav-tabs {
    border-bottom: 1px solid var(--theme-outline-button);
  }
  .nav.nav-pills {
    --_nav-tabs-radius: 50px;
    padding: calc(var(--_nav-tabs-gap) / 1.5);
    background: var(--theme-surface-container-high);
  }
  .nav.nav-pills .nav-item .nav-link {
    --_btn-radius: 50px;
  }
  .nav.nav-pills .nav-item .nav-link:is(.active, .router-link-active, .router-link-exact-active) {
    --_btn-gutter-x: 1.75rem;
    --_btn-shadow: var(--shadow-md);
    color: var(--theme-on-primary);
    background: var(--theme-on-primary-inverse);
    border-bottom: none;
  }
  .nav .nav-item .nav-link {
    --_btn-bg-color: transparent;
    --_btn-color: var(--theme-on-primary);
    --_btn-gap: .25rem;
    --_btn-radius: 8px 8px 0px 0px;
    --_btn-gutter-x: 0.75rem;
    --_btn-gutter-y: 0.65rem;
    --_btn-shadow: none;
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
    justify-content: center;
    gap: var(--_btn-gap);
    border-radius: var(--_btn-radius);
    padding-block: var(--_btn-gutter-y);
    padding-inline: var(--_btn-gutter-x);
    background: var(--_btn-bg-color);
    color: var(--_btn-color);
    border: var(--_btn-border) solid var(--_btn-border-color);
    box-shadow: var(--_btn-shadow);
    font-family: "Geist", "Roboto", -apple-system, "Segoe UI", sans-serif;
    font-weight: 700;
    font-size: 12px;
    letter-spacing: 0.16px;
    text-transform: inherit;
    line-height: 1;
    cursor: pointer;
    user-select: none;
    touch-action: manipulation;
    scale: 1;
    transition: all var(--_btn-easing-duration) var(--_btn-easing-in);
  }
  .nav .nav-item .nav-link:has(i) {
    gap: 0.45rem;
  }
  .nav .nav-item .nav-link:has(i) :where(i) {
    font-size: 1.25rem !important;
    font-variation-settings: var(--iw-semi-bold);
    color: inherit;
  }
  .nav .nav-item .nav-link:is(:hover) {
    --_btn-shadow: var(--shadow-md);
  }
  .nav .nav-item .nav-link:is(:hover) i:is(.material-symbols-rounded, .material-symbols-sharp) {
    font-variation-settings: var(--iw-bold);
  }
  .nav .nav-item .nav-link:is(:focus, :active) {
    --_btn-shadow: var(--shadow-lg);
    scale: 0.95;
  }
  .nav .nav-item .nav-link {
    --_btn-gutter-x: 0.85rem;
    --_btn-gutter-y: 0.75rem;
    font-size: 14px;
  }
  .nav .nav-item .nav-link :where(i) {
    font-size: 1.45rem;
  }
  .nav .nav-item .nav-link {
    font-weight: 500;
    color: var(--theme-muted-a10);
    text-decoration: none;
    transition: background-color 100ms ease-in-out, color 100ms ease-in-out;
  }
  .nav .nav-item .nav-link:is(:hover) {
    background: var(--theme-surface-container);
    color: var(--theme-on-primary);
  }
  .nav .nav-item .nav-link:is(.active, .router-link-active, .router-link-exact-active) {
    --_btn-gutter-x: 1.25rem;
    font-weight: 800;
    color: var(--theme-on-primary);
    border-bottom: 2px solid var(--theme-primary-a10);
  }
  .nav-pill-controls {
    --_nav-pill-radius: 50px;
    --_nav-pill-easing-in: cubic-bezier(0.05, 0.7, 0.1, 1);
    --_nav-pill-easing-duration: 400ms;
    --_nav-pill-count: 2;
    display: grid;
    grid-template-columns: repeat(var(--_nav-pill-count), 1fr);
    justify-items: center;
    justify-content: center;
    gap: 0.75rem;
    position: relative;
    padding: 0.5rem;
    margin-bottom: 0.75rem;
    width: fit-content;
    height: auto;
    list-style: none;
    border-radius: var(--_nav-pill-radius);
    background: var(--theme-surface-container);
    border: 1px solid var(--theme-outline-button);
  }
  @supports (transition: linear(0, 0, 0)) {
    .nav-pill-controls {
      --_nav-pill-easing-in: linear(0, 0.00245 1.753%, 0.00994 3.55%, 0.01966 4.916%, 0.03415 6.402%, 0.05334 7.836%, 0.07376 9.061%, 0.10031 10.32%, 0.12808 11.414%, 0.19399 13.366%, 0.27138 14.974%, 0.34403 16.052%, 0.47679 17.475%, 0.54434 18.338%, 0.60689 19.389%, 0.66036 20.609%, 0.71671 22.4%, 0.76532 24.589%, 0.78755 25.874%, 0.80828 27.285%, 0.84475 30.42%, 0.86492 32.632%, 0.88332 35.056%, 0.9002 37.721%, 0.91554 40.622%, 0.9295 43.795%, 0.94208 47.239%, 0.95333 50.97%, 0.96327 54.986%, 0.9795 64.011%, 0.99095 74.434%, 0.99774 86.373%, 1);
      --_nav-pill-easing-duration: 600ms;
    }
  }
  .nav-pill-controls.nav-tab {
    --_nav-pill-radius: 6px;
    border-color: transparent;
  }
  .nav-pill-controls.nav-tab .nav-pill-item {
    width: 100%;
  }
  .nav-pill-controls.nav-tab .nav-pill-item .nav-pill-link {
    padding-block: 0.5rem;
    padding-inline: 0.65rem;
    min-width: 5rem;
    width: inherit;
  }
  .nav-pill-controls.nav-tab .nav-pill-item .nav-pill-link:is(.active) {
    color: var(--theme-on-primary);
  }
  .nav-pill-controls.nav-tab :where(.pill-indicator):before {
    bottom: -0.35rem;
    height: 8.5%;
    background: var(--theme-primary-a10);
  }
  .nav-pill-controls.nav-tab:before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    height: 1px;
    width: 100%;
    background: var(--theme-outline-surface);
    border-radius: var(--_nav-pill-radius);
    transition: width var(--_nav-pill-easing-duration) var(--_nav-pill-easing-in);
  }
  .nav-pill-controls .nav-pill-item {
    border-radius: var(--_nav-pill-radius);
    height: auto;
    z-index: 2;
  }
  .nav-pill-controls .nav-pill-item:is(.new-item) {
    position: relative;
  }
  .nav-pill-controls .nav-pill-item:is(.new-item):after {
    content: "circle";
    font-family: "Material Symbols Rounded", sans-serif;
    font-variation-settings: "FILL" 1, "wght" 700;
    font-size: 10px;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 1;
    color: var(--theme-primary-a10);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-image: linear-gradient(135deg, #ffe572, #c28333);
    background-image: -webkit-linear-gradient(135deg, #ffe572, #c28333);
  }
  .nav-pill-controls .nav-pill-item .nav-pill-link {
    display: block;
    padding-block: 0.5rem;
    padding-inline: 1.5rem;
    min-width: 7rem;
    border-radius: var(--_nav-pill-radius);
    background: transparent;
    color: var(--theme-on-primary);
    border: 1px solid transparent;
    cursor: pointer;
    font-weight: 600;
    text-align: center;
    transition: background var(--_nav-pill-easing-duration) var(--_nav-pill-easing-in), color var(--_nav-pill-easing-duration) var(--_nav-pill-easing-in), font-weight var(--_nav-pill-easing-duration) var(--_nav-pill-easing-in);
  }
  .nav-pill-controls .nav-pill-item .nav-pill-link:is(:hover) {
    background: rgba(var(--theme-primary-rgba), 0.35);
  }
  .nav-pill-controls .nav-pill-item .nav-pill-link:is(.active) {
    font-weight: 600;
    color: var(--theme-on-primary-inverse);
  }
  .nav-pill-controls :where(.pill-indicator) {
    position: absolute;
    inset-block: 0;
    left: 5px;
    height: 80%;
    margin: auto;
    width: calc(100% / var(--_nav-pill-count) - 5px);
    translate: calc(var(--pos) * 100%);
    transition: translate calc(var(--_nav-pill-easing-duration) - 200ms) var(--_nav-pill-easing-in);
  }
  .nav-pill-controls :where(.pill-indicator):before {
    content: "";
    position: absolute;
    left: 0;
    width: 100%;
    height: 100%;
    padding-inline: 1rem;
    background: var(--theme-surface-a90);
    border-radius: calc(var(--_nav-pill-radius) - 6px);
    z-index: 1;
  }
}
@layer components.tooltip {
  .v-popper--theme-tooltip {
    --_tooltip-bg-color: var(--theme-surface-tooltip);
    --_tooltip-text-color: hsl(100, 100%, 100%);
    --_tooltip-padding: 8px;
    isolation: isolate;
    position: relative;
  }
  .v-popper--theme-tooltip .v-popper__wrapper .v-popper__inner {
    background-color: var(--_tooltip-bg-color);
    color: var(--_tooltip-text-color);
    padding: var(--_tooltip-padding);
    box-shadow: none;
    border-radius: 8px;
    font-size: 11px;
    font-weight: 500;
  }
  .v-popper--theme-tooltip .v-popper__wrapper .v-popper__inner :where(span, p, a) {
    color: var(--_tooltip-text-color);
  }
  .v-popper--theme-tooltip .v-popper__wrapper .v-popper__inner kbd {
    background-color: var(--theme-surface-kbd);
    border: 1px solid var(--theme-surface-kbd);
    color: var(--theme-on-primary-inverse);
    font-weight: 800;
  }
  .v-popper--theme-tooltip .v-popper__arrow-outer,
  .v-popper--theme-tooltip .v-popper__arrow-inner {
    visibility: hidden;
  }
}
@layer layout.flex-container {
  .container {
    --_container-gutter-x: 1.5rem;
    --_container-gutter-y: 0;
    margin-inline: auto;
    padding-inline: calc(var(--_container-gutter-x) * 0.5);
    width: 100%;
  }
  @media (min-width: 576px) {
    .container {
      max-width: 540px;
    }
  }
  @media (min-width: 768px) {
    .container {
      max-width: 720px;
    }
  }
  @media (min-width: 992px) {
    .container {
      max-width: 960px;
    }
  }
  @media (min-width: 1200px) {
    .container {
      max-width: 1140px;
    }
  }
  @media (min-width: 1400px) {
    .container {
      max-width: 1320px;
    }
  }
  .container-fluid {
    --_container-gutter-x: 1.5rem;
    --_container-gutter-y: 0;
    margin-inline: auto;
    padding-inline: calc(var(--_container-gutter-x) * 0.5);
    width: 100%;
  }
  /*
   * Flexbox system
   */
  .row {
    --_row-gutter-x: 1.5rem;
    --_row-gutter-y: 0;
    display: flex;
    flex-wrap: wrap;
    margin-top: calc(-1 * var(--_row-gutter-y));
    margin-right: calc(-0.5 * var(--_row-gutter-x));
    margin-left: calc(-0.5 * var(--_row-gutter-x));
  }
  .row > * {
    flex-shrink: 0;
    width: 100%;
    max-width: 100%;
    padding-inline: calc(var(--_row-gutter-x) * 0.5);
    margin-top: var(--_row-gutter-y);
  }
  .col {
    flex: 1 1 auto;
    width: calc(100% * 1 / 12);
    max-width: calc(100% * 1 / 12);
  }
  .col-1 {
    flex: 1 1 auto;
    width: calc(100% * 1 / 12);
    max-width: calc(100% * 1 / 12);
  }
  .col-2 {
    flex: 1 1 auto;
    width: calc(100% * 2 / 12);
    max-width: calc(100% * 2 / 12);
  }
  .col-3 {
    flex: 1 1 auto;
    width: calc(100% * 3 / 12);
    max-width: calc(100% * 3 / 12);
  }
  .col-4 {
    flex: 1 1 auto;
    width: calc(100% * 4 / 12);
    max-width: calc(100% * 4 / 12);
  }
  .col-5 {
    flex: 1 1 auto;
    width: calc(100% * 5 / 12);
    max-width: calc(100% * 5 / 12);
  }
  .col-6 {
    flex: 1 1 auto;
    width: calc(100% * 6 / 12);
    max-width: calc(100% * 6 / 12);
  }
  .col-7 {
    flex: 1 1 auto;
    width: calc(100% * 7 / 12);
    max-width: calc(100% * 7 / 12);
  }
  .col-8 {
    flex: 1 1 auto;
    width: calc(100% * 8 / 12);
    max-width: calc(100% * 8 / 12);
  }
  .col-9 {
    flex: 1 1 auto;
    width: calc(100% * 9 / 12);
    max-width: calc(100% * 9 / 12);
  }
  .col-10 {
    flex: 1 1 auto;
    width: calc(100% * 10 / 12);
    max-width: calc(100% * 10 / 12);
  }
  .col-11 {
    flex: 1 1 auto;
    width: calc(100% * 11 / 12);
    max-width: calc(100% * 11 / 12);
  }
  .col-12 {
    flex: 1 1 auto;
    width: calc(100% * 12 / 12);
    max-width: calc(100% * 12 / 12);
  }
  @media (min-width: 576px) {
    .col-sm-1 {
      flex: 1 1 auto;
      width: calc(100% * 1 / 12);
      max-width: calc(100% * 1 / 12);
    }
  }
  @media (min-width: 576px) {
    .col-sm-2 {
      flex: 1 1 auto;
      width: calc(100% * 2 / 12);
      max-width: calc(100% * 2 / 12);
    }
  }
  @media (min-width: 576px) {
    .col-sm-3 {
      flex: 1 1 auto;
      width: calc(100% * 3 / 12);
      max-width: calc(100% * 3 / 12);
    }
  }
  @media (min-width: 576px) {
    .col-sm-4 {
      flex: 1 1 auto;
      width: calc(100% * 4 / 12);
      max-width: calc(100% * 4 / 12);
    }
  }
  @media (min-width: 576px) {
    .col-sm-5 {
      flex: 1 1 auto;
      width: calc(100% * 5 / 12);
      max-width: calc(100% * 5 / 12);
    }
  }
  @media (min-width: 576px) {
    .col-sm-6 {
      flex: 1 1 auto;
      width: calc(100% * 6 / 12);
      max-width: calc(100% * 6 / 12);
    }
  }
  @media (min-width: 576px) {
    .col-sm-7 {
      flex: 1 1 auto;
      width: calc(100% * 7 / 12);
      max-width: calc(100% * 7 / 12);
    }
  }
  @media (min-width: 576px) {
    .col-sm-8 {
      flex: 1 1 auto;
      width: calc(100% * 8 / 12);
      max-width: calc(100% * 8 / 12);
    }
  }
  @media (min-width: 576px) {
    .col-sm-9 {
      flex: 1 1 auto;
      width: calc(100% * 9 / 12);
      max-width: calc(100% * 9 / 12);
    }
  }
  @media (min-width: 576px) {
    .col-sm-10 {
      flex: 1 1 auto;
      width: calc(100% * 10 / 12);
      max-width: calc(100% * 10 / 12);
    }
  }
  @media (min-width: 576px) {
    .col-sm-11 {
      flex: 1 1 auto;
      width: calc(100% * 11 / 12);
      max-width: calc(100% * 11 / 12);
    }
  }
  @media (min-width: 576px) {
    .col-sm-12 {
      flex: 1 1 auto;
      width: calc(100% * 12 / 12);
      max-width: calc(100% * 12 / 12);
    }
  }
  @media (min-width: 768px) {
    .col-md-1 {
      flex: 1 1 auto;
      width: calc(100% * 1 / 12);
      max-width: calc(100% * 1 / 12);
    }
  }
  @media (min-width: 768px) {
    .col-md-2 {
      flex: 1 1 auto;
      width: calc(100% * 2 / 12);
      max-width: calc(100% * 2 / 12);
    }
  }
  @media (min-width: 768px) {
    .col-md-3 {
      flex: 1 1 auto;
      width: calc(100% * 3 / 12);
      max-width: calc(100% * 3 / 12);
    }
  }
  @media (min-width: 768px) {
    .col-md-4 {
      flex: 1 1 auto;
      width: calc(100% * 4 / 12);
      max-width: calc(100% * 4 / 12);
    }
  }
  @media (min-width: 768px) {
    .col-md-5 {
      flex: 1 1 auto;
      width: calc(100% * 5 / 12);
      max-width: calc(100% * 5 / 12);
    }
  }
  @media (min-width: 768px) {
    .col-md-6 {
      flex: 1 1 auto;
      width: calc(100% * 6 / 12);
      max-width: calc(100% * 6 / 12);
    }
  }
  @media (min-width: 768px) {
    .col-md-7 {
      flex: 1 1 auto;
      width: calc(100% * 7 / 12);
      max-width: calc(100% * 7 / 12);
    }
  }
  @media (min-width: 768px) {
    .col-md-8 {
      flex: 1 1 auto;
      width: calc(100% * 8 / 12);
      max-width: calc(100% * 8 / 12);
    }
  }
  @media (min-width: 768px) {
    .col-md-9 {
      flex: 1 1 auto;
      width: calc(100% * 9 / 12);
      max-width: calc(100% * 9 / 12);
    }
  }
  @media (min-width: 768px) {
    .col-md-10 {
      flex: 1 1 auto;
      width: calc(100% * 10 / 12);
      max-width: calc(100% * 10 / 12);
    }
  }
  @media (min-width: 768px) {
    .col-md-11 {
      flex: 1 1 auto;
      width: calc(100% * 11 / 12);
      max-width: calc(100% * 11 / 12);
    }
  }
  @media (min-width: 768px) {
    .col-md-12 {
      flex: 1 1 auto;
      width: calc(100% * 12 / 12);
      max-width: calc(100% * 12 / 12);
    }
  }
  @media (min-width: 992px) {
    .col-lg-1 {
      flex: 1 1 auto;
      width: calc(100% * 1 / 12);
      max-width: calc(100% * 1 / 12);
    }
  }
  @media (min-width: 992px) {
    .col-lg-2 {
      flex: 1 1 auto;
      width: calc(100% * 2 / 12);
      max-width: calc(100% * 2 / 12);
    }
  }
  @media (min-width: 992px) {
    .col-lg-3 {
      flex: 1 1 auto;
      width: calc(100% * 3 / 12);
      max-width: calc(100% * 3 / 12);
    }
  }
  @media (min-width: 992px) {
    .col-lg-4 {
      flex: 1 1 auto;
      width: calc(100% * 4 / 12);
      max-width: calc(100% * 4 / 12);
    }
  }
  @media (min-width: 992px) {
    .col-lg-5 {
      flex: 1 1 auto;
      width: calc(100% * 5 / 12);
      max-width: calc(100% * 5 / 12);
    }
  }
  @media (min-width: 992px) {
    .col-lg-6 {
      flex: 1 1 auto;
      width: calc(100% * 6 / 12);
      max-width: calc(100% * 6 / 12);
    }
  }
  @media (min-width: 992px) {
    .col-lg-7 {
      flex: 1 1 auto;
      width: calc(100% * 7 / 12);
      max-width: calc(100% * 7 / 12);
    }
  }
  @media (min-width: 992px) {
    .col-lg-8 {
      flex: 1 1 auto;
      width: calc(100% * 8 / 12);
      max-width: calc(100% * 8 / 12);
    }
  }
  @media (min-width: 992px) {
    .col-lg-9 {
      flex: 1 1 auto;
      width: calc(100% * 9 / 12);
      max-width: calc(100% * 9 / 12);
    }
  }
  @media (min-width: 992px) {
    .col-lg-10 {
      flex: 1 1 auto;
      width: calc(100% * 10 / 12);
      max-width: calc(100% * 10 / 12);
    }
  }
  @media (min-width: 992px) {
    .col-lg-11 {
      flex: 1 1 auto;
      width: calc(100% * 11 / 12);
      max-width: calc(100% * 11 / 12);
    }
  }
  @media (min-width: 992px) {
    .col-lg-12 {
      flex: 1 1 auto;
      width: calc(100% * 12 / 12);
      max-width: calc(100% * 12 / 12);
    }
  }
  @media (min-width: 1200px) {
    .col-xl-1 {
      flex: 1 1 auto;
      width: calc(100% * 1 / 12);
      max-width: calc(100% * 1 / 12);
    }
  }
  @media (min-width: 1200px) {
    .col-xl-2 {
      flex: 1 1 auto;
      width: calc(100% * 2 / 12);
      max-width: calc(100% * 2 / 12);
    }
  }
  @media (min-width: 1200px) {
    .col-xl-3 {
      flex: 1 1 auto;
      width: calc(100% * 3 / 12);
      max-width: calc(100% * 3 / 12);
    }
  }
  @media (min-width: 1200px) {
    .col-xl-4 {
      flex: 1 1 auto;
      width: calc(100% * 4 / 12);
      max-width: calc(100% * 4 / 12);
    }
  }
  @media (min-width: 1200px) {
    .col-xl-5 {
      flex: 1 1 auto;
      width: calc(100% * 5 / 12);
      max-width: calc(100% * 5 / 12);
    }
  }
  @media (min-width: 1200px) {
    .col-xl-6 {
      flex: 1 1 auto;
      width: calc(100% * 6 / 12);
      max-width: calc(100% * 6 / 12);
    }
  }
  @media (min-width: 1200px) {
    .col-xl-7 {
      flex: 1 1 auto;
      width: calc(100% * 7 / 12);
      max-width: calc(100% * 7 / 12);
    }
  }
  @media (min-width: 1200px) {
    .col-xl-8 {
      flex: 1 1 auto;
      width: calc(100% * 8 / 12);
      max-width: calc(100% * 8 / 12);
    }
  }
  @media (min-width: 1200px) {
    .col-xl-9 {
      flex: 1 1 auto;
      width: calc(100% * 9 / 12);
      max-width: calc(100% * 9 / 12);
    }
  }
  @media (min-width: 1200px) {
    .col-xl-10 {
      flex: 1 1 auto;
      width: calc(100% * 10 / 12);
      max-width: calc(100% * 10 / 12);
    }
  }
  @media (min-width: 1200px) {
    .col-xl-11 {
      flex: 1 1 auto;
      width: calc(100% * 11 / 12);
      max-width: calc(100% * 11 / 12);
    }
  }
  @media (min-width: 1200px) {
    .col-xl-12 {
      flex: 1 1 auto;
      width: calc(100% * 12 / 12);
      max-width: calc(100% * 12 / 12);
    }
  }
  @media (min-width: 1400px) {
    .col-xxl-1 {
      flex: 1 1 auto;
      width: calc(100% * 1 / 12);
      max-width: calc(100% * 1 / 12);
    }
  }
  @media (min-width: 1400px) {
    .col-xxl-2 {
      flex: 1 1 auto;
      width: calc(100% * 2 / 12);
      max-width: calc(100% * 2 / 12);
    }
  }
  @media (min-width: 1400px) {
    .col-xxl-3 {
      flex: 1 1 auto;
      width: calc(100% * 3 / 12);
      max-width: calc(100% * 3 / 12);
    }
  }
  @media (min-width: 1400px) {
    .col-xxl-4 {
      flex: 1 1 auto;
      width: calc(100% * 4 / 12);
      max-width: calc(100% * 4 / 12);
    }
  }
  @media (min-width: 1400px) {
    .col-xxl-5 {
      flex: 1 1 auto;
      width: calc(100% * 5 / 12);
      max-width: calc(100% * 5 / 12);
    }
  }
  @media (min-width: 1400px) {
    .col-xxl-6 {
      flex: 1 1 auto;
      width: calc(100% * 6 / 12);
      max-width: calc(100% * 6 / 12);
    }
  }
  @media (min-width: 1400px) {
    .col-xxl-7 {
      flex: 1 1 auto;
      width: calc(100% * 7 / 12);
      max-width: calc(100% * 7 / 12);
    }
  }
  @media (min-width: 1400px) {
    .col-xxl-8 {
      flex: 1 1 auto;
      width: calc(100% * 8 / 12);
      max-width: calc(100% * 8 / 12);
    }
  }
  @media (min-width: 1400px) {
    .col-xxl-9 {
      flex: 1 1 auto;
      width: calc(100% * 9 / 12);
      max-width: calc(100% * 9 / 12);
    }
  }
  @media (min-width: 1400px) {
    .col-xxl-10 {
      flex: 1 1 auto;
      width: calc(100% * 10 / 12);
      max-width: calc(100% * 10 / 12);
    }
  }
  @media (min-width: 1400px) {
    .col-xxl-11 {
      flex: 1 1 auto;
      width: calc(100% * 11 / 12);
      max-width: calc(100% * 11 / 12);
    }
  }
  @media (min-width: 1400px) {
    .col-xxl-12 {
      flex: 1 1 auto;
      width: calc(100% * 12 / 12);
      max-width: calc(100% * 12 / 12);
    }
  }
}
@layer components.footer {
  footer,
  .footer {
    --_footer-bg-color: var(--theme-surface-container);
    --_footer-color: var(--theme-on-primary);
    --_footer-gutter-x: 0;
    --_footer-gutter-y: 2.5rem;
    --_footer-gap: 1rem;
    --_footer-radius: 25px 25px 0px 0px;
    background: var(--_footer-bg-color);
    color: var(--_footer-color);
    margin-top: var(--_footer-gutter-y);
    padding-block: var(--_footer-gutter-y);
    padding-inline: var(--_footer-gutter-x);
    border-radius: var(--_footer-radius);
  }
  footer p,
  .footer p {
    color: var(--_footer-color);
  }
  footer p:is(.footer-title),
  .footer p:is(.footer-title) {
    font-size: var(--fs-500);
    font-weight: 800;
    font-family: "Mona Sans", "Roboto", -apple-system, "Segoe UI", sans-serif;
    margin-bottom: 0.75rem;
  }
  footer p:is(.footer-subtitle),
  .footer p:is(.footer-subtitle) {
    font-size: var(--fs-sm-300);
    font-weight: 400;
    font-family: "Mona Sans", "Roboto", -apple-system, "Segoe UI", sans-serif;
    margin-bottom: 0;
    color: var(--theme-muted-a10);
  }
  footer .footer-group,
  .footer .footer-group {
    --_footer-group-direction: column;
    display: flex;
    align-items: baseline;
    gap: var(--_footer-gap);
    margin-bottom: calc(var(--_footer-gap) / 1.5);
  }
  footer .footer-group:is(.footer-col),
  .footer .footer-group:is(.footer-col) {
    flex-direction: var(--_footer-group-direction);
  }
  footer .footer-group:is(.footer-col) svg,
  .footer .footer-group:is(.footer-col) svg {
    width: 20px;
    height: 20px;
  }
  footer .footer-group:is(.footer-row),
  .footer .footer-group:is(.footer-row) {
    --_footer-group-direction: row;
    --_footer-gap: 1.5rem;
  }
  footer .footer-group p,
  .footer .footer-group p {
    color: var(--_footer-color);
    font-size: var(--fs-sm-200);
    font-weight: 700;
    font-family: "Mona Sans", "Roboto", -apple-system, "Segoe UI", sans-serif;
    margin-bottom: 0.5rem;
  }
  footer .footer-group a,
  footer .footer-group .anchor-link,
  .footer .footer-group a,
  .footer .footer-group .anchor-link {
    display: inline-block;
    color: var(--theme-muted-a10);
    font-size: var(--fs-sm-300);
    font-weight: 500;
    font-family: "Mona Sans", "Roboto", -apple-system, "Segoe UI", sans-serif;
  }
  footer .footer-group a:is(:hover),
  footer .footer-group .anchor-link:is(:hover),
  .footer .footer-group a:is(:hover),
  .footer .footer-group .anchor-link:is(:hover) {
    color: var(--theme-primary-a10);
    font-weight: 700;
  }
  footer .footer-group i,
  .footer .footer-group i {
    font-size: var(--fs-sm-100);
    font-variation-settings: var(--iw-semi-bold);
    color: var(--theme-secondary-a90);
    margin-inline-end: 0.25rem;
  }
}
@layer layout.form-check {
  .form-check {
    --_form-check-gutter-y: .85rem;
    --_form-check-gap: .75rem;
    --_form-check-height: 1.5rem;
    --_form-check-input-size: 1.25rem;
    --_form-check-input-bg-color: transparent;
    --_form-check-input-border-width: 2px;
    --_form-check-input-border-color: var(--theme-outline-text-field);
    --_form-check-input-checked-icon: none;
    --_form-check-easing-in: cubic-bezier(0.05, 0.7, 0.1, 1);
    --_form-check-easing-duration: 200ms;
    display: flex;
    align-items: center;
    gap: var(--_form-check-gap);
    min-height: var(--_form-check-height);
    margin-bottom: var(--_form-check-gutter-y);
    padding-left: 0;
  }
  @supports (transition: all 100ms linear(1, 1, 1)) {
    .form-check {
      --_form-check-easing-in: linear(0, 0.00245 1.753%, 0.00994 3.55%, 0.01966 4.916%, 0.03415 6.402%, 0.05334 7.836%, 0.07376 9.061%, 0.10031 10.32%, 0.12808 11.414%, 0.19399 13.366%, 0.27138 14.974%, 0.34403 16.052%, 0.47679 17.475%, 0.54434 18.338%, 0.60689 19.389%, 0.66036 20.609%, 0.71671 22.4%, 0.76532 24.589%, 0.78755 25.874%, 0.80828 27.285%, 0.84475 30.42%, 0.86492 32.632%, 0.88332 35.056%, 0.9002 37.721%, 0.91554 40.622%, 0.9295 43.795%, 0.94208 47.239%, 0.95333 50.97%, 0.96327 54.986%, 0.9795 64.011%, 0.99095 74.434%, 0.99774 86.373%, 1);
      --_form-check-easing-duration: 300ms;
    }
  }
  .form-check label, .form-check .form-check-label {
    display: inline-block;
    margin-bottom: 0;
  }
  .form-check .form-check-input {
    position: relative;
    width: var(--_form-check-input-size);
    height: var(--_form-check-input-size);
    margin-top: 0;
    vertical-align: top;
    -webkit-appearance: none;
    appearance: none;
    background-color: var(--_form-check-input-bg-color);
    background-image: var(--_form-check-input-checked-icon);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    border: var(--_form-check-input-border-width) solid var(--_form-check-input-border-color);
    -webkit-print-color-adjust: exact;
    color-adjust: exact;
    print-color-adjust: exact;
    transition: background-color var(--_form-check-easing-duration) var(--_form-check-easing-in), border-color var(--_form-check-easing-duration) var(--_form-check-easing-in);
  }
  .form-check .form-check-input:is(:checked) {
    --_form-check-input-border-color: var(--theme-primary-a10);
    --_form-check-input-bg-color: var(--theme-primary-a10);
  }
  .form-check .form-check-input:is(.form-check-danger:checked) {
    --_form-check-input-border-color: var(--theme-danger-a10);
    --_form-check-input-bg-color: var(--theme-danger-a10);
  }
  .form-check .form-check-input:is(:disabled) {
    pointer-events: none;
    filter: none;
    opacity: 0.5;
  }
  .form-check .form-check-input:is(:disabled) ~ .form-check-label {
    opacity: 0.75;
    color: var(--theme-muted-a10);
  }
  .form-check .form-check-input[type=checkbox] {
    border-radius: 4px;
  }
  .form-check .form-check-input[type=checkbox]:is(:checked) {
    --_form-check-input-checked-icon: var(--theme-form-checkbox-icon);
    background-image: var(--_form-check-input-checked-icon);
  }
  .form-check .form-check-input[type=radio] {
    border-radius: 50px;
  }
  .form-check .form-check-input[type=radio]:is(:checked) {
    --_form-check-input-checked-icon: var(--theme-form-radio-icon);
    background-image: var(--_form-check-input-checked-icon);
  }
}
@layer layout.form-control {
  .form-group,
  .input-group {
    --_form-group-gutter-y: .85rem;
    margin-bottom: var(--_form-group-gutter-y);
  }
  .form-group label, .form-group .form-label,
  .input-group label,
  .input-group .form-label {
    display: block;
    font-family: "Mona Sans", "Roboto", -apple-system, "Segoe UI", sans-serif;
    font-size: var(--fs-sm-400);
    font-weight: 600;
    letter-spacing: -0.01em;
    margin-bottom: calc(var(--_form-group-gutter-y) / 1.5);
  }
  .form-group .form-control, .form-group .form-select,
  .input-group .form-control,
  .input-group .form-select {
    --_form-width: 100%;
    --_form-height: 2.5rem;
    --_form-padding-x: .5rem;
    --_form-padding-y: .25rem;
    --_form-border-radius: 0px;
    --_form-bg-color: transparent;
    --_form-color: var(--theme-on-primary);
    --_form-border-width: 1px;
    --_form-border-color: var(--theme-outline-text-field);
    --_form-easing-in: cubic-bezier(0.05, 0.7, 0.1, 1);
    --_form-easing-duration: 200ms;
    position: relative;
    display: inline-block;
    width: var(--_form-width);
    height: var(--_form-height);
    padding: var(--_form-padding-y) var(--_form-padding-x);
    appearance: none;
    -webkit-appearance: none;
    border-radius: var(--_form-border-radius);
    border: var(--_form-border-width) solid var(--_form-border-color);
    background-color: var(--_form-bg-color);
    color: var(--_form-color);
    font-weight: 400;
    font-family: "Mona Sans", "Roboto", -apple-system, "Segoe UI", sans-serif;
    line-height: 1.5;
    transition: background-color var(--_form-easing-duration) var(--_form-easing-in), border-color var(--_form-easing-duration) var(--_form-easing-in), box-shadow var(--_form-easing-duration) var(--_form-easing-in);
  }
  @supports (transition: all 100ms linear(1, 1, 1)) {
    .form-group .form-control, .form-group .form-select,
    .input-group .form-control,
    .input-group .form-select {
      --_form-easing-in: linear(0, 0.00245 1.753%, 0.00994 3.55%, 0.01966 4.916%, 0.03415 6.402%, 0.05334 7.836%, 0.07376 9.061%, 0.10031 10.32%, 0.12808 11.414%, 0.19399 13.366%, 0.27138 14.974%, 0.34403 16.052%, 0.47679 17.475%, 0.54434 18.338%, 0.60689 19.389%, 0.66036 20.609%, 0.71671 22.4%, 0.76532 24.589%, 0.78755 25.874%, 0.80828 27.285%, 0.84475 30.42%, 0.86492 32.632%, 0.88332 35.056%, 0.9002 37.721%, 0.91554 40.622%, 0.9295 43.795%, 0.94208 47.239%, 0.95333 50.97%, 0.96327 54.986%, 0.9795 64.011%, 0.99095 74.434%, 0.99774 86.373%, 1);
      --_form-easing-duration: 300ms;
    }
  }
  .form-group .form-control::placeholder, .form-group .form-select::placeholder,
  .input-group .form-control::placeholder,
  .input-group .form-select::placeholder {
    color: color-mix(in srgb, var(--theme-muted-a10), transparent 35%);
  }
  .form-group .form-control::-webkit-input-placeholder, .form-group .form-select::-webkit-input-placeholder,
  .input-group .form-control::-webkit-input-placeholder,
  .input-group .form-select::-webkit-input-placeholder {
    color: color-mix(in srgb, var(--theme-muted-a10), transparent 35%);
  }
  .form-group .form-control::-moz-placeholder, .form-group .form-select::-moz-placeholder,
  .input-group .form-control::-moz-placeholder,
  .input-group .form-select::-moz-placeholder {
    color: color-mix(in srgb, var(--theme-muted-a10), transparent 35%);
  }
  .form-group .form-control::-ms-input-placeholder, .form-group .form-select::-ms-input-placeholder,
  .input-group .form-control::-ms-input-placeholder,
  .input-group .form-select::-ms-input-placeholder {
    color: color-mix(in srgb, var(--theme-muted-a10), transparent 35%);
  }
  .form-group .form-control:is(.form-filled), .form-group .form-select:is(.form-filled),
  .input-group .form-control:is(.form-filled),
  .input-group .form-select:is(.form-filled) {
    --_form-bg-color: var(--theme-surface-container-high);
  }
  .form-group .form-control:is(.form-outline), .form-group .form-select:is(.form-outline),
  .input-group .form-control:is(.form-outline),
  .input-group .form-select:is(.form-outline) {
    --_form-border-width: 2px;
  }
  .form-group .form-control:is(.form-rounded), .form-group .form-select:is(.form-rounded),
  .input-group .form-control:is(.form-rounded),
  .input-group .form-select:is(.form-rounded) {
    --_form-padding-x: .75rem;
    --_form-border-radius: 50px;
  }
  .form-group .form-control:is(:hover), .form-group .form-select:is(:hover),
  .input-group .form-control:is(:hover),
  .input-group .form-select:is(:hover) {
    --_form-border-color: var(--theme-on-primary);
  }
  .form-group .form-control:is(:focus, :active, :focus-visible), .form-group .form-select:is(:focus, :active, :focus-visible),
  .input-group .form-control:is(:focus, :active, :focus-visible),
  .input-group .form-select:is(:focus, :active, :focus-visible) {
    --_form-bg-color: var(--theme-surface-container-low);
    --_form-border-color: var(--theme-primary-a10);
    outline-offset: 0.1em;
    outline: 0;
    box-shadow: 0 0 0 0.15rem rgba(var(--theme-primary-rgba), 0.25);
  }
  .form-group .form-control:is(:disabled), .form-group .form-select:is(:disabled),
  .input-group .form-control:is(:disabled),
  .input-group .form-select:is(:disabled) {
    --_form-bg-color: var(--theme-surface-disabled);
    --_form-color: var(--theme-muted-a10);
    --_form-border-color: var(--theme-surface-disabled);
  }
  .form-group .form-control:is(:disabled):is(:hover), .form-group .form-select:is(:disabled):is(:hover),
  .input-group .form-control:is(:disabled):is(:hover),
  .input-group .form-select:is(:disabled):is(:hover) {
    --_form-border-color: var(--theme-surface-disabled);
  }
  .form-group .form-control:is(:disabled):is(:focus, :active, :focus-visible), .form-group .form-select:is(:disabled):is(:focus, :active, :focus-visible),
  .input-group .form-control:is(:disabled):is(:focus, :active, :focus-visible),
  .input-group .form-select:is(:disabled):is(:focus, :active, :focus-visible) {
    --_form-border-color: var(--theme-surface-disabled);
    box-shadow: 0 0 0 0.15rem rgba(var(--theme-muted-rgba), 0.25);
  }
  .form-group .form-control + .invalid-feedback, .form-group .form-select + .invalid-feedback,
  .input-group .form-control + .invalid-feedback,
  .input-group .form-select + .invalid-feedback {
    display: none;
  }
  .form-group .form-control:is(textarea), .form-group .form-select:is(textarea),
  .input-group .form-control:is(textarea),
  .input-group .form-select:is(textarea) {
    min-block-size: 4rlh;
    min-inline-size: 20ch;
    max-inline-size: 50ch;
  }
  .form-group .form-select,
  .input-group .form-select {
    background-image: var(--theme-form-select-icon);
    background-repeat: no-repeat;
    background-position: right 0.75rem center;
    background-size: 1.25rem;
    background-blend-mode: luminosity;
  }
  .form-group .form-range,
  .input-group .form-range {
    --_form-range-bg-color: rgba(var(--theme-primary-rgba), .35);
    --_form-range-thumb-bg-color: var(--theme-primary-a10);
    --_form-range-track-size: 0.75rem;
    --_form-range-slider-height: 1.95rem;
    --_form-range-slider-width: 0.30rem;
    --_form-range-slider-margin: calc(var(--_form-range-track-size) - 1.45rem);
    --_form-range-padding-x: .5rem;
    --_form-range-padding-y: .25rem;
    --_form-range-easing-in: cubic-bezier(0.05, 0.7, 0.1, 1);
  }
  .form-group .form-range:is([type=range]),
  .input-group .form-range:is([type=range]) {
    padding: var(--_form-range-padding-y) var(--_form-range-padding-x);
    /* Chromium */
    /* Firefox */
  }
  .form-group .form-range:is([type=range])::-webkit-slider-runnable-track,
  .input-group .form-range:is([type=range])::-webkit-slider-runnable-track {
    background-color: var(--_form-range-bg-color);
    height: var(--_form-range-track-size);
    border-radius: 50px;
  }
  .form-group .form-range:is([type=range])::-webkit-slider-thumb,
  .input-group .form-range:is([type=range])::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    margin-top: var(--_form-range-slider-margin);
    outline: 5px solid var(--theme-surface-container);
    background-color: var(--_form-range-thumb-bg-color);
    height: var(--_form-range-slider-height);
    width: var(--_form-range-slider-width);
    border-radius: 50px;
    transition: width 100ms var(--_form-range-easing-in);
  }
  .form-group .form-range:is([type=range]):is(:focus)::-webkit-slider-thumb,
  .input-group .form-range:is([type=range]):is(:focus)::-webkit-slider-thumb {
    --_form-range-slider-width: 0.25rem;
    outline: 5px solid var(--theme-surface-container);
    transition: width 100ms var(--_form-range-easing-in);
  }
  .form-group .form-range:is([type=range])::-moz-range-track,
  .input-group .form-range:is([type=range])::-moz-range-track {
    background-color: var(--_form-range-bg-color);
    height: var(--_form-range-track-size);
    border-radius: 50px;
  }
  .form-group .form-range:is([type=range])::-moz-range-thumb,
  .input-group .form-range:is([type=range])::-moz-range-thumb {
    border: none;
    outline: 5px solid var(--theme-surface-container);
    background-color: var(--_form-range-thumb-bg-color);
    height: var(--_form-range-slider-height);
    width: var(--_form-range-slider-width);
    border-radius: 50px;
  }
  .form-group .form-range:is([type=range]):is(:focus)::-moz-range-thumb,
  .input-group .form-range:is([type=range]):is(:focus)::-moz-range-thumb {
    --_form-range-slider-width: 0.25rem;
    outline: 5px solid var(--theme-surface-container);
  }
  .form-group .form-color-group,
  .input-group .form-color-group {
    --_form-group-bg-color: transparent;
    --_form-group-border-color: var(--theme-outline-text-field);
    --_form-group-border-width: 1px;
    --_form-group-border-radius: 8px;
    display: flex;
    gap: 0;
    border-radius: var(--_form-group-border-radius);
    background-color: var(--_form-group-bg-color);
    border: var(--_form-group-border-width) solid var(--_form-group-border-color);
  }
  .form-group .form-color-group .form-control,
  .input-group .form-color-group .form-control {
    --_form-border-color: transparent;
  }
  .form-group .form-color-group .form-color,
  .input-group .form-color-group .form-color {
    --_form-border-radius: 8px;
    --_form-bg-color: transparent;
    --_form-color: var(--theme-on-primary);
    --_form-border-color: transparent;
    --_form-border-width: 1px;
    display: inline-block;
    border: var(--_form-border-width) solid var(--_form-border-color);
    border-radius: var(--_form-border-radius);
    background-color: var(--_form-bg-color);
    width: 3rem;
    height: 2.5rem;
    padding: 0.375rem;
    cursor: pointer;
  }
  .form-group .form-color-group .form-color::-moz-color-swatch,
  .input-group .form-color-group .form-color::-moz-color-swatch {
    border: 0;
    border-radius: calc(var(--_form-border-radius) / 2);
  }
  .form-group .form-color-group .form-color::-webkit-color-swatch,
  .input-group .form-color-group .form-color::-webkit-color-swatch {
    border: 0;
    border-radius: calc(var(--_form-border-radius) / 2);
  }
  .form-group .form-color-group:is(:focus-within),
  .input-group .form-color-group:is(:focus-within) {
    --_form-group-border-color: var(--theme-primary-a10);
    --_form-group-bg-color: var(--theme-surface-container-high);
  }
  .form-group.form-invalid .form-control,
  .input-group.form-invalid .form-control {
    --_form-border-color: var(--theme-danger-a10);
  }
  .form-group.form-invalid .form-control:is(:focus, :active, :focus-visible),
  .input-group.form-invalid .form-control:is(:focus, :active, :focus-visible) {
    box-shadow: 0 0 0 0.15rem rgba(var(--theme-danger-rgba), 0.25);
  }
  .form-group.form-invalid .form-control + .invalid-feedback,
  .input-group.form-invalid .form-control + .invalid-feedback {
    display: block;
    margin-top: 0.45rem;
    font-size: var(--fs-sm-400);
    color: var(--theme-danger-a10);
  }
  .input-file-group {
    --_file-group-gutter-y: .85rem;
    margin-bottom: var(--_file-group-gutter-y);
  }
  .input-file-group .input-file-dropbox {
    --_file-bg-color: var(--theme-surface-body-pane);
    --_file-color: var(--theme-on-primary);
    --_file-border-width: 2px;
    --_file-border-color: var(--theme-outline-text-field);
    --_file-gutter: .25rem 0;
    --_file-border-radius: 8px;
    --_file-easing-in: cubic-bezier(0.05, 0.7, 0.1, 1);
    --_file-easing-duration: 100ms;
    --_file-height: 5rem;
    display: grid;
    place-items: center;
    position: relative;
    text-align: center;
    cursor: pointer;
    border: var(--_file-border-width) dashed var(--_file-border-color);
    background: var(--_file-bg-color);
    color: var(--theme-on-primary);
    padding: var(--_file-gutter);
    height: 100%;
    min-height: var(--_file-height);
    max-height: var(--_file-height);
    border-radius: var(--_file-border-radius);
    transition: all var(--_file-easing-duration) var(--_file-easing-in);
  }
  .input-file-group .input-file-dropbox:is(:hover) {
    --_file-bg-color: var(--theme-surface-container-high);
    --_file-color: var(--theme-on-primary);
  }
  .input-file-group .input-file-dropbox:is(:focus, :active) {
    --_file-bg-color: var(--theme-surface-container-highest);
  }
  .input-file-group .input-file-dropbox:is(.dropbox-lg) {
    --_file-height: 10rem;
  }
  .input-file-group .input-file-dropbox.valid-file {
    --_file-border-color: var(--theme-success-a10);
    --_file-bg-color: rgba(var(--theme-success-rgba), 10%);
    --_file-color: var(--theme-success-a90);
  }
  .input-file-group .input-file-dropbox :where(.input-file-text) {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--_file-gutter);
  }
  .input-file-group .input-file-dropbox :where(.input-file-text) p {
    font-weight: 500;
    font-size: var(--fs-sm-400);
    color: var(--_file-color);
    margin-bottom: 0;
  }
  .input-file-group .input-file-dropbox :where(.input-file-text) i {
    font-variation-settings: var(--iw-semi-bold);
    color: var(--_file-color);
  }
  .input-file-group .input-file-dropbox :where(.input-file) {
    position: absolute;
    cursor: pointer;
    width: 100%;
    height: 100%;
    opacity: 0;
  }
}
@layer layout.grid-container {
  .grid-list {
    container: list-columns/inline-size;
  }
  /*
  * Grid system
  */
  .grid-repeat-cols-1 {
    grid-template-columns: repeat(1, 1fr);
  }
  .grid-repeat-rows-1 {
    grid-template-rows: repeat(1, 1fr);
  }
  .grid-repeat-cols-2 {
    grid-template-columns: repeat(2, 1fr);
  }
  .grid-repeat-rows-2 {
    grid-template-rows: repeat(2, 1fr);
  }
  .grid-repeat-cols-3 {
    grid-template-columns: repeat(3, 1fr);
  }
  .grid-repeat-rows-3 {
    grid-template-rows: repeat(3, 1fr);
  }
  .grid-repeat-cols-4 {
    grid-template-columns: repeat(4, 1fr);
  }
  .grid-repeat-rows-4 {
    grid-template-rows: repeat(4, 1fr);
  }
  .grid-repeat-cols-5 {
    grid-template-columns: repeat(5, 1fr);
  }
  .grid-repeat-rows-5 {
    grid-template-rows: repeat(5, 1fr);
  }
  .grid-repeat-cols-6 {
    grid-template-columns: repeat(6, 1fr);
  }
  .grid-repeat-rows-6 {
    grid-template-rows: repeat(6, 1fr);
  }
  .grid-repeat-cols-7 {
    grid-template-columns: repeat(7, 1fr);
  }
  .grid-repeat-rows-7 {
    grid-template-rows: repeat(7, 1fr);
  }
  .grid-repeat-cols-8 {
    grid-template-columns: repeat(8, 1fr);
  }
  .grid-repeat-rows-8 {
    grid-template-rows: repeat(8, 1fr);
  }
  .grid-repeat-cols-9 {
    grid-template-columns: repeat(9, 1fr);
  }
  .grid-repeat-rows-9 {
    grid-template-rows: repeat(9, 1fr);
  }
  .grid-repeat-cols-10 {
    grid-template-columns: repeat(10, 1fr);
  }
  .grid-repeat-rows-10 {
    grid-template-rows: repeat(10, 1fr);
  }
  .grid-repeat-cols-11 {
    grid-template-columns: repeat(11, 1fr);
  }
  .grid-repeat-rows-11 {
    grid-template-rows: repeat(11, 1fr);
  }
  .grid-repeat-cols-12 {
    grid-template-columns: repeat(12, 1fr);
  }
  .grid-repeat-rows-12 {
    grid-template-rows: repeat(12, 1fr);
  }
  @media (min-width: 576px) {
    .grid-repeat-cols-sm-1 {
      grid-template-columns: repeat(1, 1fr);
    }
    .grid-repeat-rows-sm-1 {
      grid-template-rows: repeat(1, 1fr);
    }
  }
  @media (min-width: 576px) {
    .grid-repeat-cols-sm-2 {
      grid-template-columns: repeat(2, 1fr);
    }
    .grid-repeat-rows-sm-2 {
      grid-template-rows: repeat(2, 1fr);
    }
  }
  @media (min-width: 576px) {
    .grid-repeat-cols-sm-3 {
      grid-template-columns: repeat(3, 1fr);
    }
    .grid-repeat-rows-sm-3 {
      grid-template-rows: repeat(3, 1fr);
    }
  }
  @media (min-width: 576px) {
    .grid-repeat-cols-sm-4 {
      grid-template-columns: repeat(4, 1fr);
    }
    .grid-repeat-rows-sm-4 {
      grid-template-rows: repeat(4, 1fr);
    }
  }
  @media (min-width: 576px) {
    .grid-repeat-cols-sm-5 {
      grid-template-columns: repeat(5, 1fr);
    }
    .grid-repeat-rows-sm-5 {
      grid-template-rows: repeat(5, 1fr);
    }
  }
  @media (min-width: 576px) {
    .grid-repeat-cols-sm-6 {
      grid-template-columns: repeat(6, 1fr);
    }
    .grid-repeat-rows-sm-6 {
      grid-template-rows: repeat(6, 1fr);
    }
  }
  @media (min-width: 576px) {
    .grid-repeat-cols-sm-7 {
      grid-template-columns: repeat(7, 1fr);
    }
    .grid-repeat-rows-sm-7 {
      grid-template-rows: repeat(7, 1fr);
    }
  }
  @media (min-width: 576px) {
    .grid-repeat-cols-sm-8 {
      grid-template-columns: repeat(8, 1fr);
    }
    .grid-repeat-rows-sm-8 {
      grid-template-rows: repeat(8, 1fr);
    }
  }
  @media (min-width: 576px) {
    .grid-repeat-cols-sm-9 {
      grid-template-columns: repeat(9, 1fr);
    }
    .grid-repeat-rows-sm-9 {
      grid-template-rows: repeat(9, 1fr);
    }
  }
  @media (min-width: 576px) {
    .grid-repeat-cols-sm-10 {
      grid-template-columns: repeat(10, 1fr);
    }
    .grid-repeat-rows-sm-10 {
      grid-template-rows: repeat(10, 1fr);
    }
  }
  @media (min-width: 576px) {
    .grid-repeat-cols-sm-11 {
      grid-template-columns: repeat(11, 1fr);
    }
    .grid-repeat-rows-sm-11 {
      grid-template-rows: repeat(11, 1fr);
    }
  }
  @media (min-width: 576px) {
    .grid-repeat-cols-sm-12 {
      grid-template-columns: repeat(12, 1fr);
    }
    .grid-repeat-rows-sm-12 {
      grid-template-rows: repeat(12, 1fr);
    }
  }
  @media (min-width: 768px) {
    .grid-repeat-cols-md-1 {
      grid-template-columns: repeat(1, 1fr);
    }
    .grid-repeat-rows-md-1 {
      grid-template-rows: repeat(1, 1fr);
    }
  }
  @media (min-width: 768px) {
    .grid-repeat-cols-md-2 {
      grid-template-columns: repeat(2, 1fr);
    }
    .grid-repeat-rows-md-2 {
      grid-template-rows: repeat(2, 1fr);
    }
  }
  @media (min-width: 768px) {
    .grid-repeat-cols-md-3 {
      grid-template-columns: repeat(3, 1fr);
    }
    .grid-repeat-rows-md-3 {
      grid-template-rows: repeat(3, 1fr);
    }
  }
  @media (min-width: 768px) {
    .grid-repeat-cols-md-4 {
      grid-template-columns: repeat(4, 1fr);
    }
    .grid-repeat-rows-md-4 {
      grid-template-rows: repeat(4, 1fr);
    }
  }
  @media (min-width: 768px) {
    .grid-repeat-cols-md-5 {
      grid-template-columns: repeat(5, 1fr);
    }
    .grid-repeat-rows-md-5 {
      grid-template-rows: repeat(5, 1fr);
    }
  }
  @media (min-width: 768px) {
    .grid-repeat-cols-md-6 {
      grid-template-columns: repeat(6, 1fr);
    }
    .grid-repeat-rows-md-6 {
      grid-template-rows: repeat(6, 1fr);
    }
  }
  @media (min-width: 768px) {
    .grid-repeat-cols-md-7 {
      grid-template-columns: repeat(7, 1fr);
    }
    .grid-repeat-rows-md-7 {
      grid-template-rows: repeat(7, 1fr);
    }
  }
  @media (min-width: 768px) {
    .grid-repeat-cols-md-8 {
      grid-template-columns: repeat(8, 1fr);
    }
    .grid-repeat-rows-md-8 {
      grid-template-rows: repeat(8, 1fr);
    }
  }
  @media (min-width: 768px) {
    .grid-repeat-cols-md-9 {
      grid-template-columns: repeat(9, 1fr);
    }
    .grid-repeat-rows-md-9 {
      grid-template-rows: repeat(9, 1fr);
    }
  }
  @media (min-width: 768px) {
    .grid-repeat-cols-md-10 {
      grid-template-columns: repeat(10, 1fr);
    }
    .grid-repeat-rows-md-10 {
      grid-template-rows: repeat(10, 1fr);
    }
  }
  @media (min-width: 768px) {
    .grid-repeat-cols-md-11 {
      grid-template-columns: repeat(11, 1fr);
    }
    .grid-repeat-rows-md-11 {
      grid-template-rows: repeat(11, 1fr);
    }
  }
  @media (min-width: 768px) {
    .grid-repeat-cols-md-12 {
      grid-template-columns: repeat(12, 1fr);
    }
    .grid-repeat-rows-md-12 {
      grid-template-rows: repeat(12, 1fr);
    }
  }
  @media (min-width: 992px) {
    .grid-repeat-cols-lg-1 {
      grid-template-columns: repeat(1, 1fr);
    }
    .grid-repeat-rows-lg-1 {
      grid-template-rows: repeat(1, 1fr);
    }
  }
  @media (min-width: 992px) {
    .grid-repeat-cols-lg-2 {
      grid-template-columns: repeat(2, 1fr);
    }
    .grid-repeat-rows-lg-2 {
      grid-template-rows: repeat(2, 1fr);
    }
  }
  @media (min-width: 992px) {
    .grid-repeat-cols-lg-3 {
      grid-template-columns: repeat(3, 1fr);
    }
    .grid-repeat-rows-lg-3 {
      grid-template-rows: repeat(3, 1fr);
    }
  }
  @media (min-width: 992px) {
    .grid-repeat-cols-lg-4 {
      grid-template-columns: repeat(4, 1fr);
    }
    .grid-repeat-rows-lg-4 {
      grid-template-rows: repeat(4, 1fr);
    }
  }
  @media (min-width: 992px) {
    .grid-repeat-cols-lg-5 {
      grid-template-columns: repeat(5, 1fr);
    }
    .grid-repeat-rows-lg-5 {
      grid-template-rows: repeat(5, 1fr);
    }
  }
  @media (min-width: 992px) {
    .grid-repeat-cols-lg-6 {
      grid-template-columns: repeat(6, 1fr);
    }
    .grid-repeat-rows-lg-6 {
      grid-template-rows: repeat(6, 1fr);
    }
  }
  @media (min-width: 992px) {
    .grid-repeat-cols-lg-7 {
      grid-template-columns: repeat(7, 1fr);
    }
    .grid-repeat-rows-lg-7 {
      grid-template-rows: repeat(7, 1fr);
    }
  }
  @media (min-width: 992px) {
    .grid-repeat-cols-lg-8 {
      grid-template-columns: repeat(8, 1fr);
    }
    .grid-repeat-rows-lg-8 {
      grid-template-rows: repeat(8, 1fr);
    }
  }
  @media (min-width: 992px) {
    .grid-repeat-cols-lg-9 {
      grid-template-columns: repeat(9, 1fr);
    }
    .grid-repeat-rows-lg-9 {
      grid-template-rows: repeat(9, 1fr);
    }
  }
  @media (min-width: 992px) {
    .grid-repeat-cols-lg-10 {
      grid-template-columns: repeat(10, 1fr);
    }
    .grid-repeat-rows-lg-10 {
      grid-template-rows: repeat(10, 1fr);
    }
  }
  @media (min-width: 992px) {
    .grid-repeat-cols-lg-11 {
      grid-template-columns: repeat(11, 1fr);
    }
    .grid-repeat-rows-lg-11 {
      grid-template-rows: repeat(11, 1fr);
    }
  }
  @media (min-width: 992px) {
    .grid-repeat-cols-lg-12 {
      grid-template-columns: repeat(12, 1fr);
    }
    .grid-repeat-rows-lg-12 {
      grid-template-rows: repeat(12, 1fr);
    }
  }
  @media (min-width: 1200px) {
    .grid-repeat-cols-xl-1 {
      grid-template-columns: repeat(1, 1fr);
    }
    .grid-repeat-rows-xl-1 {
      grid-template-rows: repeat(1, 1fr);
    }
  }
  @media (min-width: 1200px) {
    .grid-repeat-cols-xl-2 {
      grid-template-columns: repeat(2, 1fr);
    }
    .grid-repeat-rows-xl-2 {
      grid-template-rows: repeat(2, 1fr);
    }
  }
  @media (min-width: 1200px) {
    .grid-repeat-cols-xl-3 {
      grid-template-columns: repeat(3, 1fr);
    }
    .grid-repeat-rows-xl-3 {
      grid-template-rows: repeat(3, 1fr);
    }
  }
  @media (min-width: 1200px) {
    .grid-repeat-cols-xl-4 {
      grid-template-columns: repeat(4, 1fr);
    }
    .grid-repeat-rows-xl-4 {
      grid-template-rows: repeat(4, 1fr);
    }
  }
  @media (min-width: 1200px) {
    .grid-repeat-cols-xl-5 {
      grid-template-columns: repeat(5, 1fr);
    }
    .grid-repeat-rows-xl-5 {
      grid-template-rows: repeat(5, 1fr);
    }
  }
  @media (min-width: 1200px) {
    .grid-repeat-cols-xl-6 {
      grid-template-columns: repeat(6, 1fr);
    }
    .grid-repeat-rows-xl-6 {
      grid-template-rows: repeat(6, 1fr);
    }
  }
  @media (min-width: 1200px) {
    .grid-repeat-cols-xl-7 {
      grid-template-columns: repeat(7, 1fr);
    }
    .grid-repeat-rows-xl-7 {
      grid-template-rows: repeat(7, 1fr);
    }
  }
  @media (min-width: 1200px) {
    .grid-repeat-cols-xl-8 {
      grid-template-columns: repeat(8, 1fr);
    }
    .grid-repeat-rows-xl-8 {
      grid-template-rows: repeat(8, 1fr);
    }
  }
  @media (min-width: 1200px) {
    .grid-repeat-cols-xl-9 {
      grid-template-columns: repeat(9, 1fr);
    }
    .grid-repeat-rows-xl-9 {
      grid-template-rows: repeat(9, 1fr);
    }
  }
  @media (min-width: 1200px) {
    .grid-repeat-cols-xl-10 {
      grid-template-columns: repeat(10, 1fr);
    }
    .grid-repeat-rows-xl-10 {
      grid-template-rows: repeat(10, 1fr);
    }
  }
  @media (min-width: 1200px) {
    .grid-repeat-cols-xl-11 {
      grid-template-columns: repeat(11, 1fr);
    }
    .grid-repeat-rows-xl-11 {
      grid-template-rows: repeat(11, 1fr);
    }
  }
  @media (min-width: 1200px) {
    .grid-repeat-cols-xl-12 {
      grid-template-columns: repeat(12, 1fr);
    }
    .grid-repeat-rows-xl-12 {
      grid-template-rows: repeat(12, 1fr);
    }
  }
  @media (min-width: 1400px) {
    .grid-repeat-cols-xxl-1 {
      grid-template-columns: repeat(1, 1fr);
    }
    .grid-repeat-rows-xxl-1 {
      grid-template-rows: repeat(1, 1fr);
    }
  }
  @media (min-width: 1400px) {
    .grid-repeat-cols-xxl-2 {
      grid-template-columns: repeat(2, 1fr);
    }
    .grid-repeat-rows-xxl-2 {
      grid-template-rows: repeat(2, 1fr);
    }
  }
  @media (min-width: 1400px) {
    .grid-repeat-cols-xxl-3 {
      grid-template-columns: repeat(3, 1fr);
    }
    .grid-repeat-rows-xxl-3 {
      grid-template-rows: repeat(3, 1fr);
    }
  }
  @media (min-width: 1400px) {
    .grid-repeat-cols-xxl-4 {
      grid-template-columns: repeat(4, 1fr);
    }
    .grid-repeat-rows-xxl-4 {
      grid-template-rows: repeat(4, 1fr);
    }
  }
  @media (min-width: 1400px) {
    .grid-repeat-cols-xxl-5 {
      grid-template-columns: repeat(5, 1fr);
    }
    .grid-repeat-rows-xxl-5 {
      grid-template-rows: repeat(5, 1fr);
    }
  }
  @media (min-width: 1400px) {
    .grid-repeat-cols-xxl-6 {
      grid-template-columns: repeat(6, 1fr);
    }
    .grid-repeat-rows-xxl-6 {
      grid-template-rows: repeat(6, 1fr);
    }
  }
  @media (min-width: 1400px) {
    .grid-repeat-cols-xxl-7 {
      grid-template-columns: repeat(7, 1fr);
    }
    .grid-repeat-rows-xxl-7 {
      grid-template-rows: repeat(7, 1fr);
    }
  }
  @media (min-width: 1400px) {
    .grid-repeat-cols-xxl-8 {
      grid-template-columns: repeat(8, 1fr);
    }
    .grid-repeat-rows-xxl-8 {
      grid-template-rows: repeat(8, 1fr);
    }
  }
  @media (min-width: 1400px) {
    .grid-repeat-cols-xxl-9 {
      grid-template-columns: repeat(9, 1fr);
    }
    .grid-repeat-rows-xxl-9 {
      grid-template-rows: repeat(9, 1fr);
    }
  }
  @media (min-width: 1400px) {
    .grid-repeat-cols-xxl-10 {
      grid-template-columns: repeat(10, 1fr);
    }
    .grid-repeat-rows-xxl-10 {
      grid-template-rows: repeat(10, 1fr);
    }
  }
  @media (min-width: 1400px) {
    .grid-repeat-cols-xxl-11 {
      grid-template-columns: repeat(11, 1fr);
    }
    .grid-repeat-rows-xxl-11 {
      grid-template-rows: repeat(11, 1fr);
    }
  }
  @media (min-width: 1400px) {
    .grid-repeat-cols-xxl-12 {
      grid-template-columns: repeat(12, 1fr);
    }
    .grid-repeat-rows-xxl-12 {
      grid-template-rows: repeat(12, 1fr);
    }
  }
  .grid-span-col-1 {
    grid-column: span 1/span 1;
  }
  .grid-span-col-2 {
    grid-column: span 2/span 2;
  }
  .grid-span-col-3 {
    grid-column: span 3/span 3;
  }
  .grid-span-col-4 {
    grid-column: span 4/span 4;
  }
  .grid-span-col-5 {
    grid-column: span 5/span 5;
  }
  .grid-span-col-6 {
    grid-column: span 6/span 6;
  }
  .grid-span-col-7 {
    grid-column: span 7/span 7;
  }
  .grid-span-col-8 {
    grid-column: span 8/span 8;
  }
  .grid-span-col-9 {
    grid-column: span 9/span 9;
  }
  .grid-span-col-10 {
    grid-column: span 10/span 10;
  }
  .grid-span-col-11 {
    grid-column: span 11/span 11;
  }
  .grid-span-col-12 {
    grid-column: span 12/span 12;
  }
  @media (min-width: 576px) {
    .grid-span-col-sm-1 {
      grid-column: span 1/span 1;
    }
  }
  @media (min-width: 576px) {
    .grid-span-col-sm-2 {
      grid-column: span 2/span 2;
    }
  }
  @media (min-width: 576px) {
    .grid-span-col-sm-3 {
      grid-column: span 3/span 3;
    }
  }
  @media (min-width: 576px) {
    .grid-span-col-sm-4 {
      grid-column: span 4/span 4;
    }
  }
  @media (min-width: 576px) {
    .grid-span-col-sm-5 {
      grid-column: span 5/span 5;
    }
  }
  @media (min-width: 576px) {
    .grid-span-col-sm-6 {
      grid-column: span 6/span 6;
    }
  }
  @media (min-width: 576px) {
    .grid-span-col-sm-7 {
      grid-column: span 7/span 7;
    }
  }
  @media (min-width: 576px) {
    .grid-span-col-sm-8 {
      grid-column: span 8/span 8;
    }
  }
  @media (min-width: 576px) {
    .grid-span-col-sm-9 {
      grid-column: span 9/span 9;
    }
  }
  @media (min-width: 576px) {
    .grid-span-col-sm-10 {
      grid-column: span 10/span 10;
    }
  }
  @media (min-width: 576px) {
    .grid-span-col-sm-11 {
      grid-column: span 11/span 11;
    }
  }
  @media (min-width: 576px) {
    .grid-span-col-sm-12 {
      grid-column: span 12/span 12;
    }
  }
  @media (min-width: 768px) {
    .grid-span-col-md-1 {
      grid-column: span 1/span 1;
    }
  }
  @media (min-width: 768px) {
    .grid-span-col-md-2 {
      grid-column: span 2/span 2;
    }
  }
  @media (min-width: 768px) {
    .grid-span-col-md-3 {
      grid-column: span 3/span 3;
    }
  }
  @media (min-width: 768px) {
    .grid-span-col-md-4 {
      grid-column: span 4/span 4;
    }
  }
  @media (min-width: 768px) {
    .grid-span-col-md-5 {
      grid-column: span 5/span 5;
    }
  }
  @media (min-width: 768px) {
    .grid-span-col-md-6 {
      grid-column: span 6/span 6;
    }
  }
  @media (min-width: 768px) {
    .grid-span-col-md-7 {
      grid-column: span 7/span 7;
    }
  }
  @media (min-width: 768px) {
    .grid-span-col-md-8 {
      grid-column: span 8/span 8;
    }
  }
  @media (min-width: 768px) {
    .grid-span-col-md-9 {
      grid-column: span 9/span 9;
    }
  }
  @media (min-width: 768px) {
    .grid-span-col-md-10 {
      grid-column: span 10/span 10;
    }
  }
  @media (min-width: 768px) {
    .grid-span-col-md-11 {
      grid-column: span 11/span 11;
    }
  }
  @media (min-width: 768px) {
    .grid-span-col-md-12 {
      grid-column: span 12/span 12;
    }
  }
  @media (min-width: 992px) {
    .grid-span-col-lg-1 {
      grid-column: span 1/span 1;
    }
  }
  @media (min-width: 992px) {
    .grid-span-col-lg-2 {
      grid-column: span 2/span 2;
    }
  }
  @media (min-width: 992px) {
    .grid-span-col-lg-3 {
      grid-column: span 3/span 3;
    }
  }
  @media (min-width: 992px) {
    .grid-span-col-lg-4 {
      grid-column: span 4/span 4;
    }
  }
  @media (min-width: 992px) {
    .grid-span-col-lg-5 {
      grid-column: span 5/span 5;
    }
  }
  @media (min-width: 992px) {
    .grid-span-col-lg-6 {
      grid-column: span 6/span 6;
    }
  }
  @media (min-width: 992px) {
    .grid-span-col-lg-7 {
      grid-column: span 7/span 7;
    }
  }
  @media (min-width: 992px) {
    .grid-span-col-lg-8 {
      grid-column: span 8/span 8;
    }
  }
  @media (min-width: 992px) {
    .grid-span-col-lg-9 {
      grid-column: span 9/span 9;
    }
  }
  @media (min-width: 992px) {
    .grid-span-col-lg-10 {
      grid-column: span 10/span 10;
    }
  }
  @media (min-width: 992px) {
    .grid-span-col-lg-11 {
      grid-column: span 11/span 11;
    }
  }
  @media (min-width: 992px) {
    .grid-span-col-lg-12 {
      grid-column: span 12/span 12;
    }
  }
  @media (min-width: 1200px) {
    .grid-span-col-xl-1 {
      grid-column: span 1/span 1;
    }
  }
  @media (min-width: 1200px) {
    .grid-span-col-xl-2 {
      grid-column: span 2/span 2;
    }
  }
  @media (min-width: 1200px) {
    .grid-span-col-xl-3 {
      grid-column: span 3/span 3;
    }
  }
  @media (min-width: 1200px) {
    .grid-span-col-xl-4 {
      grid-column: span 4/span 4;
    }
  }
  @media (min-width: 1200px) {
    .grid-span-col-xl-5 {
      grid-column: span 5/span 5;
    }
  }
  @media (min-width: 1200px) {
    .grid-span-col-xl-6 {
      grid-column: span 6/span 6;
    }
  }
  @media (min-width: 1200px) {
    .grid-span-col-xl-7 {
      grid-column: span 7/span 7;
    }
  }
  @media (min-width: 1200px) {
    .grid-span-col-xl-8 {
      grid-column: span 8/span 8;
    }
  }
  @media (min-width: 1200px) {
    .grid-span-col-xl-9 {
      grid-column: span 9/span 9;
    }
  }
  @media (min-width: 1200px) {
    .grid-span-col-xl-10 {
      grid-column: span 10/span 10;
    }
  }
  @media (min-width: 1200px) {
    .grid-span-col-xl-11 {
      grid-column: span 11/span 11;
    }
  }
  @media (min-width: 1200px) {
    .grid-span-col-xl-12 {
      grid-column: span 12/span 12;
    }
  }
  @media (min-width: 1400px) {
    .grid-span-col-xxl-1 {
      grid-column: span 1/span 1;
    }
  }
  @media (min-width: 1400px) {
    .grid-span-col-xxl-2 {
      grid-column: span 2/span 2;
    }
  }
  @media (min-width: 1400px) {
    .grid-span-col-xxl-3 {
      grid-column: span 3/span 3;
    }
  }
  @media (min-width: 1400px) {
    .grid-span-col-xxl-4 {
      grid-column: span 4/span 4;
    }
  }
  @media (min-width: 1400px) {
    .grid-span-col-xxl-5 {
      grid-column: span 5/span 5;
    }
  }
  @media (min-width: 1400px) {
    .grid-span-col-xxl-6 {
      grid-column: span 6/span 6;
    }
  }
  @media (min-width: 1400px) {
    .grid-span-col-xxl-7 {
      grid-column: span 7/span 7;
    }
  }
  @media (min-width: 1400px) {
    .grid-span-col-xxl-8 {
      grid-column: span 8/span 8;
    }
  }
  @media (min-width: 1400px) {
    .grid-span-col-xxl-9 {
      grid-column: span 9/span 9;
    }
  }
  @media (min-width: 1400px) {
    .grid-span-col-xxl-10 {
      grid-column: span 10/span 10;
    }
  }
  @media (min-width: 1400px) {
    .grid-span-col-xxl-11 {
      grid-column: span 11/span 11;
    }
  }
  @media (min-width: 1400px) {
    .grid-span-col-xxl-12 {
      grid-column: span 12/span 12;
    }
  }
  .grid-start-col-1 {
    grid-column-start: 1;
  }
  .grid-end-col-1 {
    grid-column-end: 1;
  }
  .grid-start-col-2 {
    grid-column-start: 2;
  }
  .grid-end-col-2 {
    grid-column-end: 2;
  }
  .grid-start-col-3 {
    grid-column-start: 3;
  }
  .grid-end-col-3 {
    grid-column-end: 3;
  }
  .grid-start-col-4 {
    grid-column-start: 4;
  }
  .grid-end-col-4 {
    grid-column-end: 4;
  }
  .grid-start-col-5 {
    grid-column-start: 5;
  }
  .grid-end-col-5 {
    grid-column-end: 5;
  }
  .grid-start-col-6 {
    grid-column-start: 6;
  }
  .grid-end-col-6 {
    grid-column-end: 6;
  }
  .grid-start-col-7 {
    grid-column-start: 7;
  }
  .grid-end-col-7 {
    grid-column-end: 7;
  }
  .grid-start-col-8 {
    grid-column-start: 8;
  }
  .grid-end-col-8 {
    grid-column-end: 8;
  }
  .grid-start-col-9 {
    grid-column-start: 9;
  }
  .grid-end-col-9 {
    grid-column-end: 9;
  }
  .grid-start-col-10 {
    grid-column-start: 10;
  }
  .grid-end-col-10 {
    grid-column-end: 10;
  }
  .grid-start-col-11 {
    grid-column-start: 11;
  }
  .grid-end-col-11 {
    grid-column-end: 11;
  }
  .grid-start-col-12 {
    grid-column-start: 12;
  }
  .grid-end-col-12 {
    grid-column-end: 12;
  }
  .grid-start-row-1 {
    grid-row-start: 1;
  }
  .grid-end-row-1 {
    grid-row-end: 1;
  }
  .grid-start-row-2 {
    grid-row-start: 2;
  }
  .grid-end-row-2 {
    grid-row-end: 2;
  }
  .grid-start-row-3 {
    grid-row-start: 3;
  }
  .grid-end-row-3 {
    grid-row-end: 3;
  }
  .grid-start-row-4 {
    grid-row-start: 4;
  }
  .grid-end-row-4 {
    grid-row-end: 4;
  }
  .grid-start-row-5 {
    grid-row-start: 5;
  }
  .grid-end-row-5 {
    grid-row-end: 5;
  }
  .grid-start-row-6 {
    grid-row-start: 6;
  }
  .grid-end-row-6 {
    grid-row-end: 6;
  }
  .grid-start-row-7 {
    grid-row-start: 7;
  }
  .grid-end-row-7 {
    grid-row-end: 7;
  }
  .grid-start-row-8 {
    grid-row-start: 8;
  }
  .grid-end-row-8 {
    grid-row-end: 8;
  }
  .grid-start-row-9 {
    grid-row-start: 9;
  }
  .grid-end-row-9 {
    grid-row-end: 9;
  }
  .grid-start-row-10 {
    grid-row-start: 10;
  }
  .grid-end-row-10 {
    grid-row-end: 10;
  }
  .grid-start-row-11 {
    grid-row-start: 11;
  }
  .grid-end-row-11 {
    grid-row-end: 11;
  }
  .grid-start-row-12 {
    grid-row-start: 12;
  }
  .grid-end-row-12 {
    grid-row-end: 12;
  }
  /*
  * Auto columns
  */
  .grid-auto-fit-cols {
    --_min-col-size: 200px;
    grid-template-columns: repeat(auto-fit, minmax(var(--_min-col-size), 1fr));
    /* Change the min columns size with the @container */
  }
  @container list-columns (width <= 400px) {
    .grid-auto-fit-cols {
      --_min-col-size: 1fr;
    }
  }
  .grid-auto-fill-cols {
    --_min-col-size: 200px;
    grid-template-columns: repeat(auto-fill, minmax(var(--_min-col-size), 1fr));
    /* Change the min columns size with the @container */
  }
  @container list-columns (width <= 400px) {
    .grid-auto-fill-cols {
      --_min-col-size: 1fr;
    }
  }
  .grid-auto-cols {
    grid-auto-columns: auto;
  }
  .grid-min-cols {
    grid-auto-columns: min-content;
  }
  .grid-max-cols {
    grid-auto-columns: max-content;
  }
  .grid-fr-cols {
    grid-auto-columns: minmax(0, 1fr);
  }
  /*
  * Auto rows
  */
  .grid-auto-rows {
    grid-auto-rows: auto;
  }
  .grid-min-rows {
    grid-auto-rows: min-content;
  }
  .grid-max-rows {
    grid-auto-rows: max-content;
  }
  .grid-fr-rows {
    grid-auto-rows: minmax(0, 1fr);
  }
  /*
  * Auto flow
  */
  .grid-auto-flow-dense {
    grid-auto-flow: dense;
  }
  .grid-auto-flow-column {
    grid-auto-flow: column;
  }
  .grid-auto-flow-column-dense {
    grid-auto-flow: column dense;
  }
  .grid-auto-flow-row {
    grid-auto-flow: row;
  }
  .grid-auto-flow-row-dense {
    grid-auto-flow: row dense;
  }
  .grid-subgrid-cols {
    grid-template-columns: subgrid;
  }
  .grid-subgrid-rows {
    grid-template-rows: subgrid;
  }
  /*
   * Grid main content
   */
  .grid-main-content {
    display: grid;
    grid-template-columns: auto 1fr;
    grid-template-rows: 1fr;
  }
}
@layer components.header {
  .header {
    position: relative;
    margin-block: 0 0.75rem;
  }
  .header .col-heading h1:is(.text-title) {
    font-size: var(--fs-400);
    line-height: 1.25;
    letter-spacing: 0.5px;
  }
  .header .col-heading h1:is(.text-title):is(.featured-title) {
    --_featured-title-height: 3px;
    --_featured-title-radius: 6px;
    --_featured-title-easing-in: cubic-bezier(0.05, 0.7, 0.1, 1);
    --_featured-title-easing-duration: 200ms;
    position: relative;
    display: inline-block;
  }
  @supports (transition: all 100ms linear(1, 1, 1)) {
    .header .col-heading h1:is(.text-title):is(.featured-title) {
      --_featured-title-easing-in: linear(0, 0.00217 0.5%, 0.00866 1.01%, 0.0346 2.07%, 0.0782 3.2%, 0.14066 4.43%, 0.28086 6.651%, 0.72289 12.911%, 0.84164 14.861%, 0.93834 16.722%, 1.01676 18.572%, 1.07743 20.432%, 1.12131 22.332%, 1.1373 23.312%, 1.14934 24.312%, 1.15904 25.603%, 1.16294 26.953%, 1.16113 28.383%, 1.15356 29.933%, 1.14335 31.273%, 1.12887 32.783%, 1.05059 39.614%, 1.01677 43.094%, 1.00206, 0.99057 46.975%, 0.98215 48.945%, 0.9766 50.995%, 0.9735 53.835%, 0.97488 57.056%, 0.9966 69.827%, 1.00329 76.878%, 1.00417 83.808%, 0.99996);
      --_featured-title-easing-duration: 600ms;
    }
  }
  .header .col-heading h1:is(.text-title):is(.featured-title):is(:hover):before {
    opacity: 1;
    visibility: visible;
  }
  .header .col-heading h1:is(.text-title):is(.featured-title):is(:hover)::after {
    --_featured-title-height: calc(100% + 0.25rem);
    --_featured-title-radius: 4px;
  }
  .header .col-heading h1:is(.text-title):is(.featured-title):before {
    content: "Featured";
    position: absolute;
    inset-block: 3px 0;
    inset-inline: 0;
    margin: auto;
    z-index: 2;
    width: fit-content;
    height: fit-content;
    line-height: 0;
    font-size: var(--fs-600);
    font-weight: inherit;
    color: hsl(0, 0%, 0%);
    opacity: 0;
    visibility: hidden;
    transition: opacity var(--_featured-title-easing-duration) ease-in-out;
  }
  .header .col-heading h1:is(.text-title):is(.featured-title):after {
    content: "";
    position: absolute;
    bottom: -0.25rem;
    left: 0;
    width: 100%;
    height: var(--_featured-title-height);
    background: -webkit-linear-gradient(45deg, #ffe572, #c28333);
    background: linear-gradient(45deg, #ffe572, #c28333);
    border-radius: var(--_featured-title-radius);
    transition: height var(--_featured-title-easing-duration) var(--_featured-title-easing-in), background-color var(--_featured-title-easing-duration) var(--_featured-title-easing-in), border-radius var(--_featured-title-easing-duration) var(--_featured-title-easing-in);
  }
  .header .col-heading .subtitle-1 {
    max-inline-size: 50ch;
    margin-bottom: 0.45rem;
    text-wrap: balance;
  }
  @supports (text-wrap: pretty) {
    .header .col-heading .subtitle-1 {
      text-wrap: pretty;
    }
  }
  .header .col-title {
    display: flex;
    gap: 1rem;
    align-items: center;
  }
  .header .col-actions {
    text-align: right;
    align-self: center;
  }
  .header .col-actions .btn-group {
    justify-content: flex-end;
  }
  .header h1 {
    font-size: var(--fs-500);
  }
  .header h1:not(:has(~ p)) {
    margin-bottom: 0;
    color: red;
  }
  .color-header-container {
    container: header-container/inline-size;
  }
  .color-header-container .color-header {
    --_color-header-gap: .75rem;
    --_color-header-gutter: 1rem;
    --_color-header-columns: auto 1fr 1fr;
    display: grid;
    grid-template-columns: var(--_color-header-columns);
    gap: var(--_color-header-gap);
    margin-bottom: var(--_color-header-gutter);
  }
  .color-header-container .color-header .color-header-title {
    display: flex;
    align-items: center;
    gap: 0.25rem;
  }
  .color-header-container .color-header .color-header-title h1 {
    margin-bottom: 0;
  }
  .color-header-container .color-header .color-header-cta {
    grid-column: span 1;
    align-content: center;
  }
  .color-header-container .color-header .color-header-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: var(--_color-header-gap);
  }
  @container header-container (width <= 500px) {
    .color-header-container .color-header {
      --_color-header-columns: repeat(2, 1fr);
      --_color-header-gutter: .35rem;
      grid-template-rows: repeat(2, 1fr);
    }
    .color-header-container .color-header .color-header-title {
      grid-row: 2/2;
      grid-column: 1/3;
      gap: 0;
    }
  }
}
@layer layout.input-group {
  .input-group {
    --_input-group-border-radius: 8px;
    --_input-group-bg-color: transparent;
    --_input-group-border-width: 1px;
    --_input-group-border-color: var(--theme-outline-text-field);
    --_input-group-gutter-x: .5rem;
    --_input-group-color: var(--theme-muted-a10);
    display: flex;
    flex-direction: row;
  }
  .input-group :where(.input-group-prefix, .input-group-suffix) {
    display: grid;
    align-items: center;
    padding-inline: var(--_input-group-gutter-x);
    background-color: var(--_input-group-bg-color);
    border: var(--_input-group-border-width) solid var(--_input-group-border-color);
    color: var(--_input-group-color);
    font-size: var(--fs-sm-300);
  }
  .input-group :where(.input-group-prefix, .input-group-suffix) i {
    color: inherit;
    font-size: var(--fs-600);
    font-variation-settings: var(--iw-semi-bold);
  }
  .input-group .input-group-prefix {
    order: 0;
    border-top-left-radius: var(--_input-group-border-radius);
    border-bottom-left-radius: var(--_input-group-border-radius);
  }
  .input-group .input-group-suffix {
    order: 1;
    border-top-right-radius: var(--_input-group-border-radius);
    border-bottom-right-radius: var(--_input-group-border-radius);
  }
  .input-group:has(.input-group-prefix) .form-control {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
  }
  .input-group:has(.input-group-suffix) .form-control {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
  }
}
@layer layout.navbar {
  .navbar {
    --_nav-shadow: none;
    --_nav-gutter-x: 0;
    --_nav-gutter-y: 0.5rem;
    --_nav-easing-in: cubic-bezier(0.05, 0.7, 0.1, 1);
    --_nav-easing-duration: 200ms;
    position: relative;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: space-between;
    padding: var(--_nav-gutter-y) var(--_nav-gutter-x);
    background: var(--theme-primary-a30);
    box-shadow: var(--_nav-shadow);
    z-index: 999;
    margin-bottom: 0;
  }
  .navbar > :where(.container, .container-fluid) {
    display: flex;
    align-items: center;
    flex-wrap: inherit;
    justify-content: space-between;
  }
  .navbar .navbar-brand {
    color: var(--theme-on-primary-inverse);
    margin-right: 0;
    margin-bottom: 0;
  }
  .navbar .navbar-brand span, .navbar .navbar-brand a {
    font-size: var(--fs-sm-100);
    font-family: "Geist", "Roboto", -apple-system, "Segoe UI", sans-serif;
    font-weight: 800;
    line-height: 0;
    color: var(--theme-on-primary-inverse);
  }
  .navbar .navbar-brand img {
    width: 100%;
    max-width: 200px;
    max-height: 200px;
    padding: 0.25rem;
    margin-right: 0.35rem;
    border-radius: 0px;
    filter: brightness(0) invert(1);
  }
  .navbar .navbar-brand:is(:hover) {
    color: var(--theme-primary-a20);
  }
  .navbar .navbar-brand:is(:active, :focus) {
    color: var(--theme-primary-a30);
  }
  .navbar .nav-title {
    display: flex;
    align-items: baseline;
    gap: 0.35rem;
  }
  .navbar .nav-title .page-title {
    font-size: var(--fs-sm-100);
    font-family: "Geist", "Roboto", -apple-system, "Segoe UI", sans-serif;
    font-weight: 800;
    color: var(--theme-muted-a10);
    letter-spacing: 0.5px;
    margin-bottom: 0;
    opacity: 0;
    visibility: hidden;
    translate: 0 1rem;
  }
  @supports (view-timeline-name: --timeline) {
    .navbar .nav-title .page-title {
      /* Attach animation to the timeline */
      animation: stuckToolbar ease-in-out both;
      animation-timeline: scroll();
      /* Tweak range when effect should start */
      animation-range: 0 200px;
    }
  }
  @keyframes stuckToolbar {
    to {
      opacity: 1;
      visibility: visible;
      translate: 0;
    }
  }
  .navbar .navbar-sm-avatar-wrapper {
    display: none;
    position: relative;
  }
  .navbar .navbar-sm-avatar-wrapper i:is(.avatar-pro-icon) {
    position: absolute;
    top: 5px;
    left: 25px;
    font-size: 16px;
    font-variation-settings: var(--iw-bold);
    background-clip: text;
    -webkit-background-clip: text;
    text-fill-color: transparent;
    -webkit-text-fill-color: transparent;
    background-image: linear-gradient(45deg, #0023f7, #382bf0);
    background-image: -webkit-linear-gradient(45deg, #0023f7, #382bf0);
  }
  .navbar .navbar-sm-avatar {
    display: none;
  }
  .navbar .navbar-collapse {
    display: none;
    align-items: center;
    flex-basis: 100%;
    flex-grow: 1;
    transition: translate calc(var(--_nav-easing-duration) / 1.75) var(--_nav-easing-in);
  }
  .navbar .navbar-collapse .navbar-nav {
    --_nav-link-gutter-x: 0;
    --_nav-link-gutter-y: 0.5rem;
    display: flex;
    flex-direction: column;
    list-style: none;
    align-items: center;
    margin-bottom: 0;
    padding-left: 0;
  }
  .navbar .navbar-collapse .navbar-nav.nav-start {
    margin-left: auto;
  }
  .navbar .navbar-collapse .navbar-nav.nav-end {
    margin-right: auto;
  }
  .navbar .navbar-collapse .navbar-nav .nav-item .nav-link {
    position: relative;
    display: block;
    border-radius: 8px;
    padding: var(--_nav-link-gutter-y) var(--_nav-link-gutter-x);
    background-color: transparent;
    color: var(--theme-on-primary);
    border: 1px solid transparent;
    font-family: "Geist", "Roboto", -apple-system, "Segoe UI", sans-serif;
    font-size: 14px;
    font-weight: 600;
    text-transform: none;
    text-decoration: none;
    user-select: none;
    transition: color 200ms ease-in-out, border-color 200ms ease-in-out, padding 200ms ease-in-out, background-color 200ms ease-in-out;
  }
  .navbar .navbar-collapse .navbar-nav .nav-item .nav-link:is(:hover) {
    color: var(--theme-primary-a10);
    background-color: var(--theme-surface-container-high);
  }
  .navbar .navbar-collapse .navbar-nav .nav-item .nav-link:is(:hover) svg {
    animation: spin 1s ease-in-out both;
  }
  .navbar .navbar-collapse .navbar-nav .nav-item .nav-link:is(.nuxt-link-exact-active, .router-link-exact-active) {
    font-weight: 800;
    padding-inline: 1rem;
    color: var(--theme-primary-a10);
    background-color: var(--theme-surface-container);
    border-color: var(--theme-surface-a60);
  }
  .navbar .navbar-collapse .navbar-nav .nav-item .nav-link:has(img, svg) {
    display: flex;
    align-items: center;
    cursor: pointer;
    gap: 0.5rem;
  }
  .navbar .navbar-collapse .navbar-nav .nav-item .nav-link:has(i) {
    position: relative;
  }
  .navbar .navbar-collapse .navbar-nav .nav-item .nav-link:has(i) > i:not(.avatar-pro-icon) {
    position: absolute;
    top: 0.3lh;
    right: -13.5px;
  }
  .navbar .navbar-collapse .navbar-nav .nav-item .nav-link:is(.avatar-link) {
    position: relative;
    cursor: pointer;
  }
  .navbar .navbar-collapse .navbar-nav .nav-item .nav-link:is(.avatar-link) i:is(.avatar-pro-icon) {
    position: absolute;
    top: 2px;
    left: 30px;
    font-size: 16px;
    font-variation-settings: var(--iw-bold);
    background-clip: text;
    -webkit-background-clip: text;
    text-fill-color: transparent;
    -webkit-text-fill-color: transparent;
    background-image: linear-gradient(45deg, #0023f7, #382bf0);
    background-image: -webkit-linear-gradient(45deg, #0023f7, #382bf0);
  }
  .navbar .navbar-collapse .navbar-nav .nav-item .nav-link:is(.button-link) {
    background-color: var(--theme-primary-a10);
    color: var(--theme-on-primary-container);
  }
  .navbar .navbar-collapse .navbar-nav .nav-item .nav-link:is(.upgrade-link) .nav-upgrade-icon {
    position: absolute;
    top: 3px;
    left: 65px;
    font-size: 16px;
    font-variation-settings: var(--iw-bold);
    background-clip: text;
    -webkit-background-clip: text;
    text-fill-color: transparent;
    -webkit-text-fill-color: transparent;
    background-image: linear-gradient(45deg, #0023f7, #382bf0);
    background-image: -webkit-linear-gradient(45deg, #0023f7, #382bf0);
    font-size: 10px;
  }
  .navbar .navbar-collapse .navbar-nav .nav-item:is(.nav-dropdown) {
    position: relative;
    cursor: pointer;
  }
  .navbar .navbar-collapse .navbar-nav .nav-item:is(.nav-dropdown) .nav-link i {
    font-size: var(--fs-500);
    color: var(--theme-muted-a10);
  }
  .navbar.nav-sticky {
    position: sticky;
    top: 0;
  }
  .navbar.nav-transparent {
    background: transparent;
  }
  @supports (transition: linear(1, 1, 1)) {
    .navbar {
      --_nav-easing-in: linear(0, 0.00245 1.753%, 0.00994 3.55%, 0.01966 4.916%, 0.03415 6.402%, 0.05334 7.836%, 0.07376 9.061%, 0.10031 10.32%, 0.12808 11.414%, 0.19399 13.366%, 0.27138 14.974%, 0.34403 16.052%, 0.47679 17.475%, 0.54434 18.338%, 0.60689 19.389%, 0.66036 20.609%, 0.71671 22.4%, 0.76532 24.589%, 0.78755 25.874%, 0.80828 27.285%, 0.84475 30.42%, 0.86492 32.632%, 0.88332 35.056%, 0.9002 37.721%, 0.91554 40.622%, 0.9295 43.795%, 0.94208 47.239%, 0.95333 50.97%, 0.96327 54.986%, 0.9795 64.011%, 0.99095 74.434%, 0.99774 86.373%, 1);
      --_nav-easing-duration: 600ms;
    }
  }
  @media (min-width: 992px) {
    .navbar .navbar-collapse {
      display: flex;
      flex-basis: auto;
    }
    .navbar .navbar-collapse .navbar-nav {
      flex-direction: row;
    }
    .navbar .navbar-collapse .navbar-nav .nav-item .nav-link {
      padding-inline: 0.5rem;
    }
  }
  .navigation-bar {
    --_navigation-bar-easing-in: cubic-bezier(0.05, 0.7, 0.1, 1);
    --_navigation-bar-easing-out: cubic-bezier(0.4, 0, 1, 1);
    --_navigation-bar-easing-duration: 300ms;
    --_navigation-bar-easing-out-duration: 200ms;
    --_navigation-bar-padding-top: 0;
    --_navigation-bar-padding-bottom: 0;
    --_navigation-bar-font-size: .65rem;
    --_navigation-bar-icon-size: 1.35rem;
    display: none;
    flex-direction: row;
    justify-content: space-around;
    align-items: center;
    position: fixed;
    bottom: 0;
    width: 100vw;
    min-height: 5rem;
    padding-top: var(--_navigation-bar-padding-top);
    padding-bottom: var(--_navigation-bar-padding-bottom);
    background-color: var(--theme-surface-container-high);
    color: var(--theme-on-primary);
    box-shadow: var(--shadow-md);
    z-index: 998;
  }
  @supports (transition: all 100ms linear(1, 1, 1)) {
    .navigation-bar {
      --_navigation-bar-easing-in: linear(0, 0.00217 0.5%, 0.00866 1.01%, 0.0346 2.07%, 0.0782 3.2%, 0.14066 4.43%, 0.28086 6.651%, 0.72289 12.911%, 0.84164 14.861%, 0.93834 16.722%, 1.01676 18.572%, 1.07743 20.432%, 1.12131 22.332%, 1.1373 23.312%, 1.14934 24.312%, 1.15904 25.603%, 1.16294 26.953%, 1.16113 28.383%, 1.15356 29.933%, 1.14335 31.273%, 1.12887 32.783%, 1.05059 39.614%, 1.01677 43.094%, 1.00206, 0.99057 46.975%, 0.98215 48.945%, 0.9766 50.995%, 0.9735 53.835%, 0.97488 57.056%, 0.9966 69.827%, 1.00329 76.878%, 1.00417 83.808%, 0.99996);
      --_navigation-bar-easing-duration: 800ms;
    }
  }
  .navigation-bar .navigation-bar-item {
    width: 25%;
    transition: cubic-bezier(0.05, 0.7, 0.1, 1);
  }
  .navigation-bar .navigation-bar-item .navigation-bar-link {
    position: relative;
    text-align: center;
    display: flex;
    flex-direction: column;
  }
  .navigation-bar .navigation-bar-item .navigation-bar-link p {
    position: relative;
    font-size: var(--_navigation-bar-font-size);
    font-family: "Mona Sans", "Roboto", -apple-system, "Segoe UI", sans-serif;
    margin-bottom: 0;
    font-weight: 500;
    z-index: 11;
  }
  .navigation-bar .navigation-bar-item .navigation-bar-link i {
    position: relative;
    justify-content: center;
    margin-bottom: 0.25rem;
    font-size: var(--_navigation-bar-icon-size);
    z-index: 11;
  }
  .navigation-bar .navigation-bar-item .navigation-bar-link p, .navigation-bar .navigation-bar-item .navigation-bar-link i {
    color: var(--theme-muted-a10);
  }
  .navigation-bar .navigation-bar-item .navigation-bar-link .indicator {
    position: absolute;
    top: -0.2rem;
    inset-inline: 0;
    margin: auto;
    padding-inline: 1.8rem;
    width: 50%;
    max-width: 80px;
    height: 1.75rem;
    border-radius: 50px;
    z-index: 10;
    scale: 0 1;
    opacity: 0;
    will-change: scale, opacity, background-color;
    transition: opacity var(--_navigation-bar-easing-out-duration) var(--_navigation-bar-easing-out), scale var(--_navigation-bar-easing-out-duration) var(--_navigation-bar-easing-out), background-color var(--_navigation-bar-easing-out-duration) var(--_navigation-bar-easing-out);
  }
  .navigation-bar .navigation-bar-item .navigation-bar-link.router-link-exact-active {
    color: var(--theme-primary-a10);
  }
  .navigation-bar .navigation-bar-item .navigation-bar-link.router-link-exact-active p, .navigation-bar .navigation-bar-item .navigation-bar-link.router-link-exact-active i {
    color: var(--theme-primary-a10);
  }
  .navigation-bar .navigation-bar-item .navigation-bar-link.router-link-exact-active p {
    font-weight: 800;
  }
  .navigation-bar .navigation-bar-item .navigation-bar-link.router-link-exact-active .indicator {
    background-color: rgba(var(--theme-primary-rgba), 20%);
    scale: 1 1;
    opacity: 1;
    transform-origin: center;
    transition: opacity var(--_navigation-bar-easing-duration) var(--_navigation-bar-easing-in), scale var(--_navigation-bar-easing-duration) var(--_navigation-bar-easing-in), background-color calc(var(--_navigation-bar-easing-duration) - 600ms) var(--_navigation-bar-easing-out);
  }
  @supports (color: color-mix(in srgb, red, blue)) {
    .navigation-bar .navigation-bar-item .navigation-bar-link.router-link-exact-active .indicator {
      background-color: color-mix(in srgb, var(--theme-primary-a10), var(--theme-surface-container-high) 80%);
    }
  }
  .navigation-bar .navigation-bar-item:hover p, .navigation-bar .navigation-bar-item:hover i {
    color: var(--theme-primary-a10);
  }
  .menu-user-container {
    --_menu-user-easing-in: cubic-bezier(0.05, 0.7, 0.1, 1);
    --_menu-user-easing-out: cubic-bezier(0.4, 0, 1, 1);
    --_menu-user-easing-duration: 300ms;
    --_menu-user-easing-out-duration: 200ms;
    position: relative;
  }
  @supports (transition: all 100ms linear(1, 1, 1)) {
    .menu-user-container {
      --_menu-user-easing-in: linear(0, 0.00245 1.753%, 0.00994 3.55%, 0.01966 4.916%, 0.03415 6.402%, 0.05334 7.836%, 0.07376 9.061%, 0.10031 10.32%, 0.12808 11.414%, 0.19399 13.366%, 0.27138 14.974%, 0.34403 16.052%, 0.47679 17.475%, 0.54434 18.338%, 0.60689 19.389%, 0.66036 20.609%, 0.71671 22.4%, 0.76532 24.589%, 0.78755 25.874%, 0.80828 27.285%, 0.84475 30.42%, 0.86492 32.632%, 0.88332 35.056%, 0.9002 37.721%, 0.91554 40.622%, 0.9295 43.795%, 0.94208 47.239%, 0.95333 50.97%, 0.96327 54.986%, 0.9795 64.011%, 0.99095 74.434%, 0.99774 86.373%, 1);
      --_menu-user-easing-duration: 800ms;
    }
  }
  .menu-user-container .menu-user {
    position: absolute;
    top: 1rem;
    right: 0;
    width: 100%;
    min-width: 18rem;
    margin: 1rem auto;
    padding: 0.25rem;
    overflow-y: auto;
    background-color: var(--theme-surface-body-pane);
    color: var(--theme-on-primary);
    box-shadow: var(--shadow-xl);
    border-radius: 6px;
    z-index: 999;
    will-change: translate, opacity, visibility;
    opacity: 0;
    visibility: hidden;
    translate: 0 -1.5rem;
    transform-origin: top right;
    transition: translate var(--_menu-user-easing-out-duration) var(--_menu-user-easing-out), opacity var(--_menu-user-easing-out-duration) var(--_menu-user-easing-out), visibility calc(var(--_menu-user-easing-out-duration) + 100ms) var(--_menu-user-easing-out);
  }
  .menu-user-container .menu-user.menu-user-visible {
    visibility: visible;
    opacity: 1;
    translate: 0;
    transition: translate var(--_menu-user-easing-duration) var(--_menu-user-easing-in), opacity calc(var(--_menu-user-easing-duration) - 250ms) cubic-bezier(0.05, 0.7, 0.1, 1), visibility calc(var(--_menu-user-easing-duration) - 250ms) cubic-bezier(0.05, 0.7, 0.1, 1);
  }
  .menu-user-container .menu-user .menu-user-header {
    display: grid;
    padding: 0.5rem 1rem;
    justify-content: center;
    align-items: flex-start;
    text-align: center;
    grid-template-areas: "close" "user";
    grid-template-columns: 1fr;
    grid-template-rows: auto 1fr;
  }
  .menu-user-container .menu-user .menu-user-header p.subtitle-1 {
    font-weight: 800;
    font-family: "Mona Sans", "Roboto", -apple-system, "Segoe UI", sans-serif;
    color: var(--theme-on-primary);
    margin-bottom: 0;
  }
  .menu-user-container .menu-user .menu-user-header p.subtitle-2 {
    color: var(--theme-muted-a10);
    margin-bottom: 0;
  }
  .menu-user-container .menu-user .menu-user-header .avatar-container {
    position: relative;
  }
  .menu-user-container .menu-user .menu-user-header .avatar-container i:is(.avatar-pro-icon) {
    position: absolute;
    top: -4px;
    left: 35px;
    font-size: 16px;
    font-variation-settings: var(--iw-bold);
    background-clip: text;
    -webkit-background-clip: text;
    text-fill-color: transparent;
    -webkit-text-fill-color: transparent;
    background-image: linear-gradient(45deg, #0023f7, #382bf0);
    background-image: -webkit-linear-gradient(45deg, #0023f7, #382bf0);
  }
  .menu-user-container .menu-user .menu-user-header .btn i {
    font-size: 1rem;
  }
  .menu-user-container .menu-user .menu-user-header div:has(.btn.btn-text) {
    grid-area: close;
    justify-self: flex-end;
  }
  .menu-user-container .menu-user .menu-user-header div:has(.avatar-container) {
    grid-area: user;
  }
  .menu-user-container .menu-user .menu-user-body {
    padding: 1rem;
  }
  .menu-user-container .menu-user .menu-user-body .menu-user-item {
    display: flex;
    padding: 0.5rem;
    margin-bottom: 0.5rem;
    width: 100%;
    border-radius: 8px;
    transition: color 100ms var(--_menu-user-easing-out), background-color 100ms var(--_menu-user-easing-out), border-radius 300ms var(--_menu-user-easing-out);
  }
  .menu-user-container .menu-user .menu-user-body .menu-user-item p {
    font-family: "Mona Sans", "Roboto", -apple-system, "Segoe UI", sans-serif;
    font-size: var(--fs-sm-400);
    color: var(--theme-muted-a10);
    align-self: center;
    margin-bottom: 0;
  }
  .menu-user-container .menu-user .menu-user-body .menu-user-item i {
    font-size: var(--fs-500);
    color: var(--theme-muted-a10);
    margin-right: 0.5rem;
  }
  .menu-user-container .menu-user .menu-user-body .menu-user-item:is(:hover) {
    background-color: rgba(var(--theme-primary-rgba), 10%);
  }
  @supports (color: color-mix(in srgb, red, blue)) {
    .menu-user-container .menu-user .menu-user-body .menu-user-item:is(:hover) {
      background-color: color-mix(in srgb, var(--theme-primary-base), var(--theme-surface-container-high) 90%);
    }
  }
  .menu-user-container .menu-user .menu-user-body .menu-user-item:is(:hover) :where(p, i) {
    color: var(--theme-primary-a30);
  }
  .menu-user-container .menu-user .menu-user-body .menu-user-item:is(.router-link-exact-active) {
    background-color: rgba(var(--theme-primary-rgba), 20%);
  }
  .menu-user-container .menu-user .menu-user-body .menu-user-item:is(.router-link-exact-active) :where(p, i) {
    color: var(--theme-primary-a90);
  }
  .menu-user-container .menu-user .menu-user-body .menu-user-item:is(.router-link-exact-active) :where(p) {
    font-weight: 800;
  }
  @supports (color: color-mix(in srgb, red, blue)) {
    .menu-user-container .menu-user .menu-user-body .menu-user-item:is(.router-link-exact-active) {
      background-color: color-mix(in srgb, var(--theme-primary-base), var(--theme-surface-container-high) 85%);
    }
  }
  .menu-user-container .menu-user .menu-user-footer {
    display: grid;
    padding: 1rem;
    border-top: 1px solid var(--theme-outline-surface);
  }
  .menu-tools-container .menu-tools {
    --_menu-tool-padding: .75rem;
    --_menu-tool-gap: .85rem;
    --_menu-tool-radius: 12px;
    --_menu-tool-grid-cols: 15rem 2fr 1fr;
    --_menu-tool-grid-tabs-cols: repeat(3, 1fr);
    --_menu-tool-grid-tools-cols: repeat(2, 1fr);
    --_menu-tool-easing-in: cubic-bezier(0.05, 0.7, 0.1, 1);
    --_menu-tool-easing-duration: 300ms;
    --_menu-tool-easing-out: cubic-bezier(0.4, 0, 1, 1);
    --_menu-tool-item-easing-in: cubic-bezier(0.05, 0.7, 0.1, 1);
    --_menu-tool-item-easing-duration: 500ms;
    position: absolute;
    top: 3.85rem;
    inset-inline: 0;
    width: auto;
    min-height: 10rem;
    translate: 0 -1rem;
    opacity: 0;
    visibility: hidden;
    transition: translate calc(var(--_menu-tool-easing-duration) / 4) var(--_menu-tool-easing-out), opacity calc(var(--_menu-tool-easing-duration) / 4) var(--_menu-tool-easing-out), visibility calc(var(--_menu-tool-easing-duration) / 4) var(--_menu-tool-easing-out);
  }
  @supports (transition: all 100ms linear(1, 1, 1)) {
    .menu-tools-container .menu-tools {
      --_menu-tool-easing-in: linear(0, 0.00217 0.5%, 0.00866 1.01%, 0.0346 2.07%, 0.0782 3.2%, 0.14066 4.43%, 0.28086 6.651%, 0.72289 12.911%, 0.84164 14.861%, 0.93834 16.722%, 1.01676 18.572%, 1.07743 20.432%, 1.12131 22.332%, 1.1373 23.312%, 1.14934 24.312%, 1.15904 25.603%, 1.16294 26.953%, 1.16113 28.383%, 1.15356 29.933%, 1.14335 31.273%, 1.12887 32.783%, 1.05059 39.614%, 1.01677 43.094%, 1.00206, 0.99057 46.975%, 0.98215 48.945%, 0.9766 50.995%, 0.9735 53.835%, 0.97488 57.056%, 0.9966 69.827%, 1.00329 76.878%, 1.00417 83.808%, 0.99996);
      --_menu-tool-easing-duration: 800ms;
    }
  }
  .menu-tools-container .menu-tools.menu-tools-visible {
    translate: 0;
    opacity: 1;
    visibility: visible;
    transition: translate var(--_menu-tool-easing-duration) var(--_menu-tool-easing-in), opacity calc(var(--_menu-tool-easing-duration) / 2) cubic-bezier(0.05, 0.7, 0.1, 1), visibility calc(var(--_menu-tool-easing-duration) / 2) cubic-bezier(0.05, 0.7, 0.1, 1);
  }
  .menu-tools-container .menu-tools .menu-body {
    display: grid;
    grid-template-columns: var(--_menu-tool-grid-cols);
    padding: 1rem;
    gap: 1rem;
    width: 100%;
    min-height: 22rem;
    max-height: 22rem;
    overflow-y: auto;
    overscroll-behavior: contain;
    background-color: var(--theme-surface-body-pane);
    box-shadow: var(--shadow-lg);
    border-radius: var(--_menu-tool-radius);
  }
  .menu-tools-container .menu-tools .menu-body .menu-tabs {
    display: grid;
    grid-template-rows: var(--_menu-tool-grid-tabs-cols);
    gap: var(--_menu-tool-gap);
    align-self: flex-start;
  }
  .menu-tools-container .menu-tools .menu-body .menu-tabs .menu-tab-item {
    display: flex;
    flex-direction: column;
    padding: var(--_menu-tool-padding);
    background-color: transparent;
    border-radius: var(--_menu-tool-radius);
    cursor: pointer;
    user-select: none;
    transition-property: background-color, scale;
    transition-duration: var(--_menu-tool-item-easing-duration);
    transition-timing-function: var(--_menu-tool-item-easing-in);
  }
  .menu-tools-container .menu-tools .menu-body .menu-tabs .menu-tab-item p:is(.subtitle-1) {
    font-weight: 800;
    font-family: "Mona Sans", "Roboto", -apple-system, "Segoe UI", sans-serif;
    font-size: var(--fs-sm-400);
    margin-bottom: 0;
  }
  .menu-tools-container .menu-tools .menu-body .menu-tabs .menu-tab-item p:is(.subtitle-2) {
    color: var(--theme-muted-a10);
    font-size: var(--fs-sm-500);
    margin-bottom: 0;
  }
  .menu-tools-container .menu-tools .menu-body .menu-tabs .menu-tab-item:is(:hover) {
    background-color: var(--theme-surface-container-low);
    scale: 0.95;
  }
  .menu-tools-container .menu-tools .menu-body .menu-tabs .menu-tab-item:is(:focus, :active) {
    background-color: var(--theme-surface-container-high);
  }
  .menu-tools-container .menu-tools .menu-body .menu-tabs .menu-tab-item:is(.menu-tab-active) {
    background-color: var(--theme-surface-container-high);
  }
  .menu-tools-container .menu-tools .menu-body .menu-tabs .menu-tab-item:is(.menu-tab-active) p:is(.subtitle-1) {
    color: var(--theme-primary-a30);
  }
  .menu-tools-container .menu-tools .menu-body .menu-grid {
    display: grid;
    grid-template-columns: var(--_menu-tool-grid-tools-cols);
    gap: var(--_menu-tool-gap);
    align-self: flex-start;
  }
  .menu-tools-container .menu-tools .menu-body .menu-grid .menu-grid-title {
    grid-column: span 2;
    font-weight: 600;
    font-family: "Mona Sans", "Roboto", -apple-system, "Segoe UI", sans-serif;
    font-size: var(--fs-sm-500);
    color: var(--theme-primary-a30);
    text-transform: uppercase;
  }
  .menu-tools-container .menu-tools .menu-body .menu-grid .menu-link {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: var(--_menu-tool-gap);
    padding: calc(var(--_menu-tool-padding) / 2);
    height: 100%;
    background-color: transparent;
    border-radius: var(--_menu-tool-radius);
    user-select: none;
    transition: background-color var(--_menu-tool-item-easing-duration) var(--_menu-tool-item-easing-in), border-radius var(--_menu-tool-item-easing-duration) var(--_menu-tool-item-easing-in);
  }
  .menu-tools-container .menu-tools .menu-body .menu-grid .menu-link :where(.icon-wrap:not(.icon-wrap-gradient)) {
    color: var(--theme-primary-a30);
  }
  .menu-tools-container .menu-tools .menu-body .menu-grid .menu-link p:is(.subtitle-1) {
    font-weight: 800;
    font-family: "Mona Sans", "Roboto", -apple-system, "Segoe UI", sans-serif;
    font-size: var(--fs-sm-400);
    color: var(--theme-on-primary);
    margin-bottom: 0;
  }
  .menu-tools-container .menu-tools .menu-body .menu-grid .menu-link p:is(.subtitle-1) i {
    font-size: var(--fs-sm-100);
    font-variation-settings: var(--iw-bold);
    translate: -1rem;
    opacity: 0;
    visibility: hidden;
    transition: translate calc(var(--_menu-tool-easing-duration) * 1.5) var(--_menu-tool-easing-in), opacity var(--_menu-tool-easing-duration) var(--_menu-tool-easing-in), visibility var(--_menu-tool-easing-duration) var(--_menu-tool-easing-in);
  }
  .menu-tools-container .menu-tools .menu-body .menu-grid .menu-link p:is(.subtitle-2) {
    color: var(--theme-muted-a10);
    font-size: var(--fs-sm-500);
    margin-bottom: 0;
  }
  .menu-tools-container .menu-tools .menu-body .menu-grid .menu-link:is(:hover) {
    --_menu-tool-radius: 25px;
    background-color: var(--theme-surface-container-high);
  }
  .menu-tools-container .menu-tools .menu-body .menu-grid .menu-link:is(:hover) .icon-wrap {
    border-radius: var(--_menu-tool-radius);
    transition: border-radius var(--_menu-tool-easing-duration) var(--_menu-tool-easing-in);
  }
  .menu-tools-container .menu-tools .menu-body .menu-grid .menu-link:is(:hover) p:is(.subtitle-1) i {
    --_menu-tool-easing-duration: 300ms;
    translate: 0.25rem;
    opacity: 1;
    visibility: visible;
  }
  .menu-tools-container .menu-tools .menu-body .menu-grid .menu-link:is(.router-link-active, .router-link-exact-active) {
    --_menu-tool-radius: 50px;
    background-color: var(--theme-surface-container-high);
  }
  .menu-tools-container .menu-tools .menu-body .menu-grid .menu-link:is(.router-link-active, .router-link-exact-active) .icon-wrap {
    border-radius: var(--_menu-tool-radius);
  }
  .menu-tools-container .menu-tools .menu-body .menu-grid .menu-link:is(.router-link-active, .router-link-exact-active) p:is(.subtitle-1) {
    color: var(--theme-primary-a0);
  }
  .menu-tools-container .menu-tools .menu-body .menu-news {
    display: grid;
    grid-template-columns: 1fr;
    place-content: center;
    padding: var(--_menu-tool-padding);
    height: 100%;
    width: 100%;
    background-color: rgba(var(--theme-success-rgba), 10%);
    border-radius: calc(var(--_menu-tool-radius) / 2);
  }
  .menu-tools-container .menu-tools .menu-body .menu-news p:is(.subtitle-1) {
    font-weight: 800;
    font-family: "Mona Sans", "Roboto", -apple-system, "Segoe UI", sans-serif;
  }
  @media (prefers-reduced-motion) {
    .nav-menu-container .nav-menu {
      translate: 0;
      transition: opacity 300ms ease-out, visibility 300ms ease-out;
    }
    .nav-menu-container .nav-menu.nav-menu-active {
      translate: 0;
      transition: opacity 300ms ease-in, visibility 300ms ease-in;
    }
    .menu-user-container .menu-user {
      translate: 0;
      transition: opacity 300ms ease-out, visibility 300ms ease-out;
    }
    .menu-user-container .menu-user.menu-user-visible {
      translate: 0;
      transition: opacity 300ms ease-in, visibility 300ms ease-in;
    }
    .navigation-bar .navigation-bar-item .navigation-bar-link .indicator {
      scale: 1;
      transition: opacity 300ms var(--easing-out);
    }
    .navigation-bar .navigation-bar-item .navigation-bar-link.nuxt-link-exact-active .indicator {
      scale: 1;
      transition: opacity 600ms var(--easing-in);
    }
  }
}
@layer layout.sidebar {
  .navigation-drawer {
    --_drawer-border-radius: 25px 0px 0px 25px;
    --_drawer-easing-in: cubic-bezier(0.05, 0.7, 0.1, 1);
    --_drawer-easing-out: cubic-bezier(0.4, 0, 1, 1);
    --_drawer-easing-duration: 300ms;
    --_drawer-gutter: calc(1rem - 6px);
    --_discrete: allow-discrete;
    container: DrawerContainer/inline-size;
    position: sticky;
    top: 0;
    display: block;
    width: var(--theme-nav-drawer-width);
    height: 100vh;
    max-height: 100vh;
    background-color: var(--theme-on-primary);
    color: var(--theme-on-primary-inverse);
    box-shadow: var(--shadow-lg);
    z-index: 99;
    padding: 1.2rem;
    border-top-right-radius: 25px;
    border-bottom-right-radius: 25px;
    will-change: translate, width;
    translate: 0;
    transition: width var(--_drawer-easing-duration) var(--_drawer-easing-out), translate var(--_drawer-easing-duration) var(--_drawer-easing-out);
  }
  @supports (transition: all 100ms linear(1, 1, 1)) {
    .navigation-drawer {
      --_drawer-easing-in: linear(0, 0.00245 1.753%, 0.00994 3.55%, 0.01966 4.916%, 0.03415 6.402%, 0.05334 7.836%, 0.07376 9.061%, 0.10031 10.32%, 0.12808 11.414%, 0.19399 13.366%, 0.27138 14.974%, 0.34403 16.052%, 0.47679 17.475%, 0.54434 18.338%, 0.60689 19.389%, 0.66036 20.609%, 0.71671 22.4%, 0.76532 24.589%, 0.78755 25.874%, 0.80828 27.285%, 0.84475 30.42%, 0.86492 32.632%, 0.88332 35.056%, 0.9002 37.721%, 0.91554 40.622%, 0.9295 43.795%, 0.94208 47.239%, 0.95333 50.97%, 0.96327 54.986%, 0.9795 64.011%, 0.99095 74.434%, 0.99774 86.373%, 1);
      --_drawer-easing-out: linear(0, 0.00245 1.753%, 0.00994 3.55%, 0.01966 4.916%, 0.03415 6.402%, 0.05334 7.836%, 0.07376 9.061%, 0.10031 10.32%, 0.12808 11.414%, 0.19399 13.366%, 0.27138 14.974%, 0.34403 16.052%, 0.47679 17.475%, 0.54434 18.338%, 0.60689 19.389%, 0.66036 20.609%, 0.71671 22.4%, 0.76532 24.589%, 0.78755 25.874%, 0.80828 27.285%, 0.84475 30.42%, 0.86492 32.632%, 0.88332 35.056%, 0.9002 37.721%, 0.91554 40.622%, 0.9295 43.795%, 0.94208 47.239%, 0.95333 50.97%, 0.96327 54.986%, 0.9795 64.011%, 0.99095 74.434%, 0.99774 86.373%, 1);
      --_drawer-easing-duration: 600ms;
    }
  }
  .navigation-drawer.drawer-closed {
    width: calc(var(--theme-nav-drawer-width) / 2);
    transition: width var(--_drawer-easing-duration) var(--_drawer-easing-out), translate var(--_drawer-easing-duration) var(--_drawer-easing-out);
  }
  .navigation-drawer.drawer-bordered {
    box-shadow: none;
    border-radius: 0px;
    border-right: 1px solid var(--theme-on-primary);
  }
  .navigation-drawer .drawer-content {
    display: flex;
    flex-direction: column;
    flex-basis: auto;
    flex-wrap: nowrap;
    height: 100%;
    min-height: 100%;
  }
  .navigation-drawer .drawer-content .drawer-header {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    word-break: break-all;
    align-items: center;
    padding: calc(var(--_drawer-gutter) / 1.5);
    will-change: flex-direction, align-items;
    transition: flex-direction var(--_drawer-easing-duration) var(--_drawer-easing-in), align-items var(--_drawer-easing-duration) var(--_drawer-easing-in);
  }
  .navigation-drawer .drawer-content .drawer-header p {
    font-family: "Mona Sans", "Roboto", -apple-system, "Segoe UI", sans-serif;
    font-weight: 800;
    font-size: var(--fs-600);
    margin-bottom: 0;
    transition: opacity 300ms ease-in-out, display ease-in-out 300ms var(--_discrete);
    /* Before changes */
    /* Changing state */
  }
  @starting-style {
    .navigation-drawer .drawer-content .drawer-header p {
      opacity: 0;
    }
  }
  .navigation-drawer .drawer-content .drawer-header p {
    opacity: 1;
  }
  .navigation-drawer .drawer-content .drawer-header .sidebar-username {
    margin-top: 10px;
    padding: 15px 0 5px 0;
    border-bottom: 1px solid var(--theme-on-primary);
  }
  .navigation-drawer .drawer-content .drawer-header :where(img, i) {
    --_drawer-brand-size: 5rem;
    font-size: var(--_drawer-brand-size);
    width: var(--_drawer-brand-size);
    max-height: var(--_drawer-brand-size);
    will-change: width, font-size;
    transition: width var(--_drawer-easing-duration) var(--_drawer-easing-in), font-size var(--_drawer-easing-duration) var(--_drawer-easing-in);
  }
  .navigation-drawer .drawer-content .drawer-header :where(img) {
    filter: brightness(0) invert(1);
  }
  .navigation-drawer .drawer-content .drawer-body {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: calc(var(--_drawer-gutter) / 2);
    padding: calc(var(--_drawer-gutter) / 1.5);
    margin-block: calc(var(--_drawer-gutter) * 2);
    overflow-y: auto;
    overflow-x: hidden;
  }
  .navigation-drawer .drawer-content .drawer-body .drawer-item {
    display: flex;
    gap: var(--_drawer-gutter);
    font-size: var(--fs-sm-400);
    font-weight: 600;
    font-family: "Geist", "Roboto", -apple-system, "Segoe UI", sans-serif;
    color: var(--theme-on-secondary-inverse);
    background-color: transparent;
    border-radius: 0px;
    padding: 0.5rem;
    cursor: pointer;
    align-items: center;
    will-change: background-color, flex-direction, align-items, font-size;
    transition: background-color var(--_drawer-easing-duration) var(--_drawer-easing-in), flex-direction var(--_drawer-easing-duration) var(--_drawer-easing-in), align-items var(--_drawer-easing-duration) var(--_drawer-easing-in), font-size var(--_drawer-easing-duration) var(--_drawer-easing-in);
  }
  .navigation-drawer .drawer-content .drawer-body .drawer-item i {
    font-size: 20px;
    font-variation-settings: var(--iw-semi-bold);
  }
  .navigation-drawer .drawer-content .drawer-body .drawer-item:hover {
    background-color: rgba(var(--theme-secondary-rgba), 0.25);
  }
  .navigation-drawer .drawer-content .drawer-body .drawer-item:hover i {
    font-variation-settings: var(--iw-semi-bold);
  }
  .navigation-drawer .drawer-content .drawer-body .drawer-item.router-link-exact-active, .navigation-drawer .drawer-content .drawer-body .drawer-item.active {
    color: var(--theme-on-secondary-inverse);
    background-color: rgba(var(--theme-secondary-rgba), 0.5);
    font-weight: 800;
  }
  .navigation-drawer .drawer-content .drawer-body .drawer-item.router-link-exact-active i, .navigation-drawer .drawer-content .drawer-body .drawer-item.active i {
    font-variation-settings: var(--iw-bold);
  }
  .navigation-drawer .drawer-content .drawer-body .drawer-text {
    font-size: var(--fs-sm-300);
    color: var(--theme-muted-a10);
    padding-inline: 0.5rem;
    margin-block: 0.5rem;
  }
  .navigation-drawer .drawer-content .drawer-footer {
    display: inline-flex;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: flex-start;
    gap: calc(var(--_drawer-gutter) / 2);
    padding: calc(var(--_drawer-gutter) / 1.5);
  }
  .navigation-drawer .drawer-content .drawer-footer p {
    font-weight: 500;
    margin-bottom: 0;
  }
  .navigation-drawer .drawer-content .drawer-footer .btn {
    flex-grow: 1;
  }
  @container DrawerContainer (width <= 9rem) {
    .navigation-drawer .drawer-content .drawer-header {
      flex-direction: column;
      align-items: center;
    }
    .navigation-drawer .drawer-content .drawer-header p {
      display: none;
      opacity: 0;
    }
    .navigation-drawer .drawer-content .drawer-header :where(img, i) {
      --_drawer-brand-size: 3.5rem;
      max-height: 4.5rem;
    }
    .navigation-drawer .drawer-content .drawer-body .drawer-text {
      display: none;
    }
    .navigation-drawer .drawer-content .drawer-body .drawer-item {
      flex-direction: column;
      align-items: center;
      font-size: var(--fs-sm-500);
      gap: calc(var(--_drawer-gutter) / 2);
    }
    .navigation-drawer .drawer-content .drawer-body .drawer-item span {
      display: none;
    }
  }
  @media (prefers-reduced-motion) {
    .navigation-drawer {
      translate: 0;
      opacity: 0;
      visibility: hidden;
      transition: opacity 300ms ease-out, visibility 300ms ease-out;
    }
    .navigation-drawer.sheet {
      translate: 0;
      scale: unset;
    }
    .navigation-drawer.sheet.sheet-filters {
      translate: 10px;
      scale: unset;
    }
    .navigation-drawer.sheet-active {
      translate: 0;
      opacity: 1;
      scale: unset;
      transform-origin: left;
      transition: opacity 300ms ease-in, visibility 300ms ease-in;
    }
    .navigation-drawer.sheet-active .drawer-content {
      transition: opacity 350ms ease-in;
    }
  }
}
@layer layout.media-queries {
  @media only screen and (max-width: 1024px) {
    body:has(.navigation-drawer.sheet.sheet-filters:is(.sheet-active)) {
      overflow-y: hidden;
    }
    body:has(.bottom-sheet:is(.sheet-open)) {
      overflow-y: hidden;
    }
    .navigation-drawer,
    .navigation-drawer.drawer-closed {
      display: none;
    }
    .grid-main-content {
      display: block;
      grid-template-columns: 1fr;
    }
    .sidebar-collapse {
      display: none;
    }
    .navigation-bar {
      display: flex;
    }
    @supports (hanging-punctuation: first) and (font: -apple-system-body) and (-webkit-appearance: none) {
      .navigation-bar {
        --_navigation-bar-padding-top: calc(.75rem + env(safe-area-inset-top, 0.5vh));
        --_navigation-bar-padding-bottom: env(safe-area-inset-bottom, 0.5vh);
      }
    }
    main {
      padding-bottom: 6rem;
    }
    main:has(footer, .footer) {
      padding-bottom: 3.5rem;
    }
  }
  @media only screen and (max-width: 1024px) and (prefers-reduced-motion) {
    .navigation-drawer.sheet.sheet-filters {
      translate: 0;
    }
  }
  @media only screen and (max-width: 992px) {
    .fab-group {
      --_btn-fab-position-y: 5.85rem;
      --_btn-fab-position-x: .75rem;
    }
    @supports (hanging-punctuation: first) and (font: -apple-system-body) and (-webkit-appearance: none) {
      .fab-group {
        --_btn-fab-position-y: 6.35rem;
      }
    }
    .fab-group .btn-fab {
      aspect-ratio: 1;
    }
    .fab-group .btn-fab span {
      display: none;
    }
    .pwa-alert-container {
      --_pwa-alert-position-x: .5rem;
      --_pwa-alert-position-y: 6rem;
      max-width: 100%;
      left: var(--_pwa-alert-position-x);
    }
    .navbar > :where(.container, .container-fluid) {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
    }
    .navbar .navbar-brand {
      justify-self: start;
    }
    .navbar .navbar-sm-avatar-wrapper {
      display: inline-flex;
      justify-self: flex-end;
    }
    .menu-user-container {
      position: absolute;
    }
    .menu-user-container .menu-user {
      position: fixed;
      top: 0;
      bottom: 0;
      right: 0;
      left: 0;
      margin: auto;
      width: 80%;
      height: fit-content;
    }
    .menu-tools-container .menu-tools {
      --_menu-tool-grid-cols: 1fr 2fr;
    }
    .menu-tools-container .menu-tools .menu-body .menu-news {
      display: none;
    }
    .header :where(.col-heading h1:is(.text-title)) {
      font-size: var(--fs-500);
    }
    .alert-container:has(.alert-snackbar) {
      bottom: calc(6rem + env(safe-area-inset-bottom, 0.5vh));
    }
    .dialog {
      top: unset;
      bottom: 0;
      margin: 0;
      width: 100%;
      max-width: 100%;
      height: 75vh;
    }
    @supports (height: 100lvh) {
      .dialog {
        height: 75lvh;
      }
    }
    .dialog:is(.dialog-modal) {
      --_dialog-radius: 25px 25px 0 0;
      /* 0. Not visible default state */
      scale: unset;
      translate: 0 80vh;
      transform-origin: bottom center;
      /* 2. On appear transition */
      /* 1. Before appear on screen */
    }
    .dialog:is(.dialog-modal) {
      transition: overlay 100ms var(--_discrete), display 100ms var(--_discrete), scale var(--_dialog-easing-duration), translate var(--_dialog-easing-duration), opacity calc(var(--_dialog-easing-duration) / 3);
    }
    @supports (transition: all 100ms linear(1, 1, 1)) {
      .dialog:is(.dialog-modal) {
        --_dialog-easing-in: cubic-bezier(0.05, 0.7, 0.1, 1);
        --_dialog-easing-duration: 500ms;
      }
    }
    .dialog:is(.dialog-modal)[open] {
      scale: unset;
      translate: 0 0;
      opacity: 1;
    }
    @starting-style {
      .dialog:is(.dialog-modal)[open], .dialog:is(.dialog-modal)[open]::backdrop {
        opacity: 0;
      }
      .dialog:is(.dialog-modal)[open] {
        translate: 0 70vh;
      }
    }
    .dialog:is(.dialog-side-sheet) {
      width: 75%;
      height: 100%;
    }
    .dialog:is(.dialog-confirm) {
      height: 35vh;
    }
    @supports (height: 100lvh) {
      .dialog:is(.dialog-confirm) {
        height: 35lvh;
      }
    }
    .dialog:is(.dialog-confirm) :where(.dialog-content .dialog-footer) {
      display: grid;
      grid-template-columns: repeat(1, 1fr);
      grid-template-rows: repeat(2, 1fr);
    }
    .dialog:is(.dialog-confirm) :where(.dialog-content .dialog-footer) .btn:is(.btn-gradient) {
      grid-area: 1/1;
    }
    .dialog.dialog-cols-2 .dialog-content {
      grid-auto-flow: row;
      grid-template-rows: 5rem 1fr;
      grid-template-columns: 1fr;
    }
    .dialog.dialog-cols-2 .dialog-content .dialog-header {
      padding: 0;
    }
    .dialog.dialog-cols-2 .dialog-content .dialog-footer {
      position: sticky;
      bottom: 0;
    }
  }
  @media only screen and (max-width: 960px) {
    .navbar:has(.menu-tools-visible) {
      background-color: var(--theme-surface-body-pane);
    }
    .menu-tools-container .menu-tools {
      --_menu-tool-grid-cols: auto 1fr;
      --_menu-tool-grid-tabs-cols: 1fr;
      --_menu-tool-grid-tools-cols: 1fr;
      top: 3.45rem;
      inset-inline: 0;
      margin: auto;
    }
    .menu-tools-container .menu-tools .menu-body {
      grid-template-rows: auto 1fr;
      grid-template-columns: 1fr;
      min-height: calc(100dvh - 3.45rem);
      max-height: calc(100dvh - 3.45rem);
      max-width: 100%;
      align-self: flex-start;
    }
    .menu-tools-container .menu-tools .menu-body .menu-grid {
      grid-template-rows: calc(var(--_menu-tool-grid-tools-cols) * 6);
      grid-template-columns: var(--_menu-tool-grid-tools-cols);
    }
    .menu-tools-container .menu-tools .menu-body .menu-grid .menu-grid-title {
      grid-column: span 1;
    }
  }
  @media only screen and (max-width: 768px) {
    .navbar:has(.menu-user-visible) {
      background-color: var(--theme-surface-body-pane);
    }
    .menu-user-container .menu-user {
      top: 3.45rem;
      width: 100%;
      height: 100%;
      max-height: calc(100dvh - 3.45rem);
      border-radius: 0px;
    }
    .header .col-actions {
      display: none;
    }
    .fab-mobile {
      display: inline-flex;
    }
  }
}
@layer pages.core {
  .card-pane {
    background-color: var(--theme-surface-body-pane);
  }
}
@layer pages.map {
  .vehicle-container {
    display: grid;
    /** Fixed width for the vehicle sidebar */
    grid-template-areas: "alerts map chat";
    grid-template-columns: 350px 1fr 300px;
  }
  .vehicle-container .vehicle-list-sidebar {
    --_list-sidebar-button-top: 4.5rem;
    --_list-sidebar-button-right: -1.25rem;
    --_list-sidebar-easing-in: cubic-bezier(0.05, 0.7, 0.1, 1);
    --_list-sidebar-easing-duration: 300ms;
    grid-area: alerts;
    position: relative;
    padding: 1rem;
    z-index: 10;
    height: calc(100vh - 68.6px);
    background: var(--theme-surface-body-pane);
    max-height: 100%;
    overflow-y: scroll;
    /** Width transition progressive enhancement for modern browsers */
    interpolate-size: allow-keywords;
    transition: width var(--_list-sidebar-easing-duration) var(--_list-sidebar-easing-in);
  }
  @supports (transition: all 100ms linear(1, 1, 1)) {
    .vehicle-container .vehicle-list-sidebar {
      --_list-sidebar-easing-in: linear(0, 0.00245 1.753%, 0.00994 3.55%, 0.01966 4.916%, 0.03415 6.402%, 0.05334 7.836%, 0.07376 9.061%, 0.10031 10.32%, 0.12808 11.414%, 0.19399 13.366%, 0.27138 14.974%, 0.34403 16.052%, 0.47679 17.475%, 0.54434 18.338%, 0.60689 19.389%, 0.66036 20.609%, 0.71671 22.4%, 0.76532 24.589%, 0.78755 25.874%, 0.80828 27.285%, 0.84475 30.42%, 0.86492 32.632%, 0.88332 35.056%, 0.9002 37.721%, 0.91554 40.622%, 0.9295 43.795%, 0.94208 47.239%, 0.95333 50.97%, 0.96327 54.986%, 0.9795 64.011%, 0.99095 74.434%, 0.99774 86.373%, 1);
      --_list-sidebar-easing-duration: 600ms;
    }
  }
  .vehicle-container .vehicle-list-sidebar.sidebar-collapsed {
    --_list-sidebar-button-top: 0.5rem;
    --_list-sidebar-button-right: -1rem;
    width: 0;
  }
  .vehicle-container .vehicle-list-sidebar.sidebar-collapsed > *:not(.sidebar-collapse-button) {
    display: none;
  }
  .vehicle-container .vehicle-list-sidebar .sidebar-collapse-button {
    position: absolute;
    top: var(--_list-sidebar-button-top);
    right: var(--_list-sidebar-button-right);
    transition: top var(--_list-sidebar-easing-duration) var(--_list-sidebar-easing-in);
  }
  .vehicle-container .chat-sidebar {
    grid-area: chat;
    position: relative;
    padding: 1rem;
    z-index: 10;
    height: calc(100vh - 68.6px);
    background: var(--theme-surface-body-pane);
  }
  .vehicle-container .chat-sidebar .chat-wrapper {
    display: grid;
    grid-template-areas: "header" "chat" "footer";
    grid-template-rows: auto calc(100vh - 210px) auto;
    grid-template-columns: 1fr;
    gap: 1rem;
  }
  .vehicle-container .chat-sidebar .chat-wrapper .chat-header {
    grid-area: header;
    display: flex;
    width: 100%;
    border-bottom: 1px solid var(--theme-outline-surface);
  }
  .vehicle-container .chat-sidebar .chat-wrapper .chat-body {
    grid-area: chat;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    overflow-y: auto;
    max-height: 100%;
  }
  .vehicle-container .chat-sidebar .chat-wrapper .chat-body .bubble {
    display: inline-flex;
    width: fit-content;
    padding: 0.75rem;
    background: var(--theme-surface-container);
    box-shadow: var(--shadow-sm);
    font-size: var(--fs-sm-100);
  }
  .vehicle-container .chat-sidebar .chat-wrapper .chat-body .bubble:is(.sender) {
    align-self: flex-end;
    background: var(--theme-secondary-a10);
    color: var(--theme-on-secondary-inverse);
  }
  .vehicle-container .chat-sidebar .chat-wrapper .chat-body .bubble:has(img) {
    flex-direction: column;
    gap: 0.5rem;
  }
  .vehicle-container .chat-sidebar .chat-wrapper .chat-body .bubble:has(img) img {
    outline: 3px solid var(--theme-surface-container);
    border-radius: 0px !important;
    padding: 0.35rem;
    background: white;
  }
  .vehicle-container .chat-sidebar .chat-wrapper .chat-footer {
    grid-area: footer;
    border-top: 1px solid var(--theme-outline-surface);
    display: flex;
    justify-content: space-between;
  }
  .vehicle-container .chat-sidebar .chat-wrapper .chat-footer .form-group {
    width: 100%;
    margin-bottom: 0 !important;
  }
  .vehicle-container .chat-sidebar .chat-wrapper .chat-footer .form-group label {
    display: none !important;
  }
  .map {
    --_map-controls-bg-color: var(--theme-surface-body-pane);
    --_map-controls-border-color: var(--theme-outline-button);
    position: fixed;
    z-index: 1;
    inset: 0;
    margin: auto;
    width: 100%;
    min-height: 100vh;
    isolation: isolate;
  }
  @supports (min-height: 100dvh) {
    .map {
      min-height: 100dvh;
    }
  }
  .map:is(.map-focus):after {
    content: "";
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    background: radial-gradient(circle at center, transparent 50%, rgba(18, 18, 18, 0.6) 60%, rgba(0, 52, 132, 0.6) 80%, rgba(0, 30, 77, 0.6) 100%);
  }
  .map :where(.mapboxgl-ctrl-top-right) {
    top: 4.5rem;
    right: 0.5rem;
  }
  .map :where(.mapboxgl-ctrl-top-right) .mapboxgl-ctrl-geocoder {
    border-radius: 12px;
  }
  .map :where(.mapboxgl-ctrl-top-right) .mapboxgl-ctrl-geocoder input {
    background: var(--_map-controls-bg-color);
    color: var(--theme-on-primary);
    border: 1px solid var(--theme-outline-surface);
    font-size: var(--fs-sm-400);
    border-radius: inherit;
  }
  .map :where(.mapboxgl-ctrl-top-right) .mapboxgl-ctrl-geocoder input::placeholder::placeholder {
    color: color-mix(in srgb, var(--theme-muted-a10), transparent 35%);
  }
  .map :where(.mapboxgl-ctrl-top-right) .mapboxgl-ctrl-geocoder input::placeholder::-webkit-input-placeholder {
    color: color-mix(in srgb, var(--theme-muted-a10), transparent 35%);
  }
  .map :where(.mapboxgl-ctrl-top-right) .mapboxgl-ctrl-geocoder input::placeholder::-moz-placeholder {
    color: color-mix(in srgb, var(--theme-muted-a10), transparent 35%);
  }
  .map :where(.mapboxgl-ctrl-top-right) .mapboxgl-ctrl-geocoder input::placeholder::-ms-input-placeholder {
    color: color-mix(in srgb, var(--theme-muted-a10), transparent 35%);
  }
  .map :where(.mapboxgl-ctrl-top-right) .mapboxgl-ctrl:is(.mapboxgl-ctrl-group) {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    background: var(--_map-controls-bg-color);
    border: 1px solid var(--_map-controls-border-color);
    color: var(--theme-on-primary-container);
    border-radius: calc(12px - 0.25rem);
    padding: 0.25rem;
  }
  .map :where(.mapboxgl-ctrl-top-right) .mapboxgl-ctrl:is(.mapboxgl-ctrl-group) button {
    color: var(--theme-on-primary-container);
    border: 1px solid transparent;
    border-radius: 8px;
  }
  .map :where(.mapboxgl-ctrl-top-right) .mapboxgl-ctrl:is(.mapboxgl-ctrl-group) button:hover {
    background: var(--theme-surface-container-highest);
  }
  .map :where(.mapboxgl-ctrl-top-right) .mapboxgl-ctrl:is(.mapboxgl-ctrl-group) button span {
    filter: var(--theme-img-filter-invert);
  }
  .map-bar {
    --_map-bar-position: top;
    --_map-bar-width: 10rem;
    --_map-bar-height: 10rem;
    --_map-bar-radius: 8px;
    --_map-bar-padding: 1rem;
    position: fixed;
    margin: auto;
    width: var(--_map-bar-width);
    height: var(--_map-bar-height);
    padding: var(--_map-bar-padding);
    background: var(--theme-frosted-glass-bg);
    backdrop-filter: var(--theme-frosted-glass-backdrop-filter);
    border-radius: var(--_map-bar-radius);
  }
  .map-bar .map-bar-item {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 0.75rem;
  }
  .map-bar .map-bar-item p {
    font-size: var(--fs-sm-400);
    margin-bottom: 0;
  }
  .map-bar .map-bar-item i {
    font-size: var(--fs-600);
  }
  .map-bar:is(.top, .bottom) {
    --_map-bar-width: calc(100%);
    --_map-bar-height: 3rem;
    --_map-bar-radius: 0px;
  }
  .map-bar:is(.top) {
    top: 0;
    inset-inline: 0;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
  }
  .map-bar:is(.bottom) {
    bottom: 0;
    inset-inline: 0;
  }
  .map-bar:is(.left, .right) {
    --_map-bar-width: 20rem;
    --_map-bar-height: calc(100%);
    --_map-bar-radius: 0px;
    padding-top: 0;
    max-height: var(--_map-bar-height);
    overflow-y: scroll;
    top: 3rem;
  }
  .map-bar:is(.left) {
    left: 0;
  }
  .map-bar:is(.left) .lpr-group {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
  }
  .map-bar:is(.left) .lpr-group .card {
    background: var(--theme-frosted-glass-bg) !important;
  }
  .map-bar:is(.left) .lpr-group .card .card-body {
    --_card-gutter-x: .5rem;
    --_card-gutter-y: .5rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  .map-bar:is(.left) .lpr-group .card .card-body p {
    font-weight: 800;
  }
  .map-bar:is(.left) .lpr-group .card .card-body .img-fluid {
    width: 4rem;
    max-width: 4rem;
    min-height: 4rem;
    max-height: 4rem;
    aspect-ratio: 1;
    object-fit: cover;
    border-radius: 0px;
  }
  .map-bar:is(.right) {
    right: 0;
  }
  .meter-line {
    --_map-meter-bar-width: 100%;
    --_map-meter-bar-height: .5rem;
    --_map-meter-bar-radius: 6px;
    --_map-meter-bar-padding: .5rem;
    --_map-meter-bar-background: var(--theme-surface-container);
    --_map-meter-bar-color: var(--theme-on-primary);
    position: relative;
    width: var(--_map-meter-bar-width);
    height: var(--_map-meter-bar-height);
    padding: var(--_map-meter-bar-padding);
    margin-bottom: var(--_map-meter-bar-padding);
    background: var(--_map-meter-bar-background);
    border-radius: var(--_map-meter-bar-radius);
    color: var(--_map-meter-bar-color);
  }
  .meter-line:is(.meter-gas) {
    background: linear-gradient(90deg, hsl(354, 73%, 51%), var(--theme-on-primary) 40%);
  }
  .meter-line:is(.meter-temperature) {
    background: linear-gradient(90deg, #0adeff, var(--theme-on-primary), hsl(354, 73%, 51%));
  }
  .meter-line .meter-indicator {
    --indicator-position: 45%;
    position: absolute;
    top: -0.25rem;
    left: var(--indicator-position);
    width: 0.35rem;
    height: 150%;
    background: hsl(354, 73%, 51%);
    border: 1px solid var(--theme-on-primary);
    border-radius: calc(var(--_map-meter-bar-radius) / 2);
    box-shadow: var(--shadow-sm);
  }
  .chat-layout {
    background: var(--theme-surface-container-low);
    padding: 0.5rem;
    border-radius: 12px;
  }
  .chat-layout .chat-container {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    overflow-y: scroll;
    height: 100%;
    min-height: calc(100% - 8rem);
    max-height: calc(100% - 8rem);
  }
  .chat-layout .chat-container .chat-bubble {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 0.5rem;
    border-radius: 12px;
    width: 50%;
    background: var(--theme-surface-container-highest);
    box-shadow: var(--shadow-md);
  }
  .chat-layout .chat-container .chat-bubble p {
    font-family: "Geist", "Roboto", -apple-system, "Segoe UI", sans-serif;
    font-weight: 600;
    font-size: var(--fs-sm-400);
    color: var(--theme-on-primary);
    line-height: 1.25;
    margin-bottom: 0.15rem;
  }
  .chat-layout .chat-container .chat-bubble small {
    font-size: 8px;
    color: var(--theme-muted-a10);
  }
  .chat-layout .chat-container .chat-bubble:is(.receiver) {
    align-self: flex-start;
    border-radius: 0 8px 8px 8px;
  }
  .chat-layout .chat-container .chat-bubble:is(.receiver) p {
    color: var(--theme-on-primary);
  }
  .chat-layout .chat-container .chat-bubble:is(.sender) {
    align-self: flex-end;
    color: var(--theme-on-primary-inverse);
    background: var(--theme-on-primary);
    border-radius: 8px 0 8px 8px;
  }
  .chat-layout .chat-container .chat-bubble:is(.sender) p {
    color: var(--theme-on-primary-container);
  }
  .chat-layout .chat-container .chat-bubble:is(.sender) small {
    color: inherit;
  }
  .chat-layout .chat-container .chat-bubble:has(img) {
    flex-direction: column;
    width: 100%;
  }
  .chat-layout .chat-container .chat-bubble:has(img) img:is(.img-fullscreen) {
    position: fixed;
    inset-inline: 0;
    top: unset;
    bottom: 0;
    width: 100%;
    box-shadow: var(--shadow-xl);
    border-radius: 0px;
  }
  .chat-layout .chat-container .chat-bubble:last-child {
    margin-bottom: 1.5rem;
  }
  .chat-layout .chat-input {
    position: sticky;
    bottom: 1.5rem;
    padding: 0.5rem;
    background: var(--theme-surface-container);
  }
  .mapboxgl-popup-content {
    min-width: 150px;
    width: fit-content;
    background-color: var(--theme-surface-container);
  }
  .mapboxgl-popup-anchor-bottom .mapboxgl-popup-tip {
    border-top-color: var(--theme-surface-container);
  }
  .mapboxgl-popup-anchor-bottom .mapboxgl-popup-close-button {
    color: var(--theme-on-primary);
  }
}
@layer utilities.background {
  .bg-primary {
    background-color: var(--theme-primary-a10);
  }
  .bg-secondary {
    background-color: var(--theme-secondary-a10);
  }
  .bg-accent {
    background-color: var(--theme-accent-a10);
  }
  .bg-success {
    background-color: var(--theme-success-a10);
  }
  .bg-warning {
    background-color: var(--theme-warning-a10);
  }
  .bg-danger {
    background-color: var(--theme-danger-a10);
  }
  .bg-dark {
    background-color: hsl(0, 0%, 0%);
  }
  .bg-white {
    background-color: hsl(100, 100%, 100%);
  }
  .bg-body {
    background-color: var(--theme-background);
  }
  .bg-surface-base {
    background-color: var(--theme-surface-base);
  }
  .bg-surface-pane {
    background-color: var(--theme-surface-body-pane);
  }
  .bg-frosted {
    background-color: var(--theme-frosted-glass-bg);
    backdrop-filter: var(--theme-frosted-glass-backdrop-filter);
  }
  .bg-transparent {
    background-color: transparent;
  }
  .bg-primary-emphasis {
    background-color: var(--theme-primary-a30);
  }
  .bg-secondary-emphasis {
    background-color: var(--theme-secondary-a30);
  }
  .bg-accent-emphasis {
    background-color: var(--theme-accent-a30);
  }
  .bg-success-emphasis {
    background-color: var(--theme-success-a30);
  }
  .bg-warning-emphasis {
    background-color: var(--theme-warning-a30);
  }
  .bg-danger-emphasis {
    background-color: var(--theme-danger-a30);
  }
  .bg-primary-fixed {
    --_bg-opacity: .35;
    background: rgba(var(--theme-primary-rgba), var(--_bg-opacity));
  }
  .bg-secondary-fixed {
    --_bg-opacity: .35;
    background: rgba(var(--theme-secondary-rgba), var(--_bg-opacity));
  }
  .bg-accent-fixed {
    --_bg-opacity: .35;
    background: rgba(var(--theme-accent-rgba), var(--_bg-opacity));
  }
  .bg-success-fixed {
    --_bg-opacity: .35;
    background: rgba(var(--theme-success-rgba), var(--_bg-opacity));
  }
  .bg-warning-fixed {
    --_bg-opacity: .35;
    background: rgba(var(--theme-warning-rgba), var(--_bg-opacity));
  }
  .bg-danger-fixed {
    --_bg-opacity: .35;
    background: rgba(var(--theme-danger-rgba), var(--_bg-opacity));
  }
  /*
  * Fixed opacity
  * Generate fixed opacity background utilities for each value
  */
  .bg-opacity-0 {
    --_bg-opacity: 0;
  }
  .bg-opacity-5 {
    --_bg-opacity: 0.05;
  }
  .bg-opacity-10 {
    --_bg-opacity: 0.1;
  }
  .bg-opacity-20 {
    --_bg-opacity: 0.2;
  }
  .bg-opacity-30 {
    --_bg-opacity: 0.3;
  }
  .bg-opacity-40 {
    --_bg-opacity: 0.4;
  }
  .bg-opacity-50 {
    --_bg-opacity: 0.5;
  }
  .bg-opacity-60 {
    --_bg-opacity: 0.6;
  }
  .bg-opacity-70 {
    --_bg-opacity: 0.7;
  }
  .bg-opacity-80 {
    --_bg-opacity: 0.8;
  }
  .bg-opacity-90 {
    --_bg-opacity: 0.9;
  }
  .bg-opacity-100 {
    --_bg-opacity: 1;
  }
  .bg-wrapper {
    --_bg-wrapper-gutter-inline: 1rem;
    --_bg-wrapper-gutter-block: 1rem;
    --_bg-wrapper-radius: 0px;
    --_bg-wrapper-min-height: calc(100vh - 185px);
    background-color: var(--theme-surface-body-pane);
    padding-inline: var(--_bg-wrapper-gutter-inline);
    padding-block: var(--_bg-wrapper-gutter-block);
    border-radius: var(--_bg-wrapper-radius);
    min-height: var(--_bg-wrapper-min-height);
    box-shadow: var(--shadow-md);
  }
  .bg-wrapper.bg-sm {
    --_bg-wrapper-min-height: auto;
  }
  .bg-wrapper:has(.border.border-animated) {
    isolation: isolate;
  }
  .bg-custom-mixed {
    background: color-mix(in srgb, var(--_bg-custom-color) 90%, var(--_text-custom-color));
  }
  .bg-gradient {
    background: -webkit-linear-gradient(45deg, #c11ceb, #6f19b5, #25007a);
    background: linear-gradient(45deg, #c11ceb, #6f19b5, #25007a);
  }
}
@layer utilities.border-radius {
  .rounded-none {
    border-radius: 0px;
  }
  .rounded-sm {
    border-radius: 6px;
  }
  .rounded-md {
    border-radius: 8px;
  }
  .rounded-lg {
    border-radius: 12px;
  }
  .rounded-xl {
    border-radius: 25px;
  }
  .rounded-full {
    border-radius: 50px;
  }
  .rounded-t-none {
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
  }
  .rounded-r-none {
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
  }
  .rounded-b-none {
    border-bottom-right-radius: 0px;
    border-bottom-left-radius: 0px;
  }
  .rounded-l-none {
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
  }
  .rounded-t-sm {
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
  }
  .rounded-r-sm {
    border-top-right-radius: 6px;
    border-bottom-right-radius: 6px;
  }
  .rounded-b-sm {
    border-bottom-right-radius: 6px;
    border-bottom-left-radius: 6px;
  }
  .rounded-l-sm {
    border-top-left-radius: 6px;
    border-bottom-left-radius: 6px;
  }
  .rounded-t-md {
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
  }
  .rounded-r-md {
    border-top-right-radius: 8px;
    border-bottom-right-radius: 8px;
  }
  .rounded-b-md {
    border-bottom-right-radius: 8px;
    border-bottom-left-radius: 8px;
  }
  .rounded-l-md {
    border-top-left-radius: 8px;
    border-bottom-left-radius: 8px;
  }
  .rounded-t-lg {
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
  }
  .rounded-r-lg {
    border-top-right-radius: 12px;
    border-bottom-right-radius: 12px;
  }
  .rounded-b-lg {
    border-bottom-right-radius: 12px;
    border-bottom-left-radius: 12px;
  }
  .rounded-l-lg {
    border-top-left-radius: 12px;
    border-bottom-left-radius: 12px;
  }
  .rounded-t-xl {
    border-top-left-radius: 25px;
    border-top-right-radius: 25px;
  }
  .rounded-r-xl {
    border-top-right-radius: 25px;
    border-bottom-right-radius: 25px;
  }
  .rounded-b-xl {
    border-bottom-right-radius: 25px;
    border-bottom-left-radius: 25px;
  }
  .rounded-l-xl {
    border-top-left-radius: 25px;
    border-bottom-left-radius: 25px;
  }
  .rounded-t-full {
    border-top-left-radius: 50px;
    border-top-right-radius: 50px;
  }
  .rounded-r-full {
    border-top-right-radius: 50px;
    border-bottom-right-radius: 50px;
  }
  .rounded-b-full {
    border-bottom-right-radius: 50px;
    border-bottom-left-radius: 50px;
  }
  .rounded-l-full {
    border-top-left-radius: 50px;
    border-bottom-left-radius: 50px;
  }
  /*
  * Border radius
  * Generate border radius utilities for each value
  */
  .border-radius-0 {
    border-radius: 0px;
  }
  .border-radius-4 {
    border-radius: 4px;
  }
  .border-radius-6 {
    border-radius: 6px;
  }
  .border-radius-8 {
    border-radius: 8px;
  }
  .border-radius-12 {
    border-radius: 12px;
  }
  .border-radius-25 {
    border-radius: 25px;
  }
  .border-radius-50 {
    border-radius: 50px;
  }
}
@layer utilities.borders {
  .border {
    --_border-bg-color: var(--theme-outline-surface);
    --_border-size: 1px;
    border: var(--_border-size) solid var(--_border-bg-color);
  }
  .border.border-md {
    --_border-size: 2px;
  }
  .border.border-lg {
    --_border-size: 4px;
  }
  .border.border-dashed {
    border-style: dashed;
  }
  .border.border-dotted {
    border-style: dotted;
  }
  .border.border-primary {
    --_border-bg-color: var(--theme-primary-a10);
  }
  .border.border-secondary {
    --_border-bg-color: var(--theme-secondary-a10);
  }
  .border.border-accent {
    --_border-bg-color: var(--theme-accent-a10);
  }
  .border.border-success {
    --_border-bg-color: var(--theme-success-a10);
  }
  .border.border-warning {
    --_border-bg-color: var(--theme-warning-a10);
  }
  .border.border-danger {
    --_border-bg-color: var(--theme-danger-a10);
  }
  .border.border-muted {
    --_border-bg-color: var(--theme-muted-a10);
  }
  .border.border-transparent {
    --_border-bg-color: transparent;
  }
  .border.border-gradient {
    --_border-bg-color: transparent;
    --_border-gradient: var(--theme-primary-a10), var(--theme-primary-a30);
    background: linear-gradient(var(--theme-background), var(--theme-background)) padding-box, linear-gradient(120deg, var(--_border-gradient)) border-box;
  }
  .border.border-gradient.g-primary {
    --_badge-gradient-color: hsl(100, 100%, 100%);
    --_border-gradient: #0023f7, #382bf0;
  }
  .border.border-gradient.g-gold {
    --_border-gradient: #875919, #a87732, #dbaa64, #f0c588;
  }
  .border.border-gradient.g-green {
    --_border-gradient: #4ae17b, #11d181;
  }
  .border.border-gradient.g-cyan {
    --_border-gradient: #0adeff, #0a81ff;
  }
  .border.border-gradient.g-yellow {
    --_border-gradient: #ffe572, #c28333;
  }
  .border.border-gradient.g-orange {
    --_border-gradient: #c20ea1, #dd2d7f, #ee4c5e, #f46d41;
  }
  .border.border-gradient.g-purple {
    --_border-gradient: #c11ceb, #6f19b5, #25007a;
  }
  .border.border-gradient.g-red {
    --_border-gradient: #e91e63, #d81557, #aa1145;
  }
  .border.border-gradient.g-blue {
    --_border-gradient: #148ade, #116ab8;
  }
  .border.border-gradient.g-black {
    --_border-gradient: #404040, #212121;
  }
  .border.border-gradient.g-indigo {
    --_border-gradient: #715cff, #6851ff;
  }
  .border.border-gradient.g-violet {
    --_border-gradient: #8200e7, #bf3eff;
  }
  .border.border-gradient.g-body-primary {
    --_border-gradient: var(--theme-on-primary), #382bf0;
  }
  .border.border-gradient.g-body-secondary {
    --_border-gradient: var(--theme-on-primary), #ffc107;
  }
  .border.border-gradient.g-body-success {
    --_border-gradient: var(--theme-on-primary), #009f42;
  }
  .border.border-gradient.g-body-danger {
    --_border-gradient: var(--theme-on-primary), #b41c2b;
  }
  .border.border-animated {
    position: relative;
  }
  .border.border-animated::before, .border.border-animated::after {
    content: "";
    position: absolute;
    inset: -0.1rem;
    z-index: -1;
    background: conic-gradient(from var(--gradient-angle), var(--_border-gradient));
    border-radius: inherit;
    animation: angle-spin 5s linear infinite;
  }
  .border.border-animated::after {
    filter: blur(0.5rem);
    -webkit-filter: blur(0.5rem);
  }
  .border.border-animated.g-primary {
    --_badge-gradient-color: hsl(100, 100%, 100%);
    --_border-gradient: #0023f7, #382bf0;
  }
  .border.border-animated.g-gold {
    --_border-gradient: #875919, #a87732, #dbaa64, #f0c588;
  }
  .border.border-animated.g-green {
    --_border-gradient: #4ae17b, #11d181;
  }
  .border.border-animated.g-cyan {
    --_border-gradient: #0adeff, #0a81ff;
  }
  .border.border-animated.g-yellow {
    --_border-gradient: #ffe572, #c28333;
  }
  .border.border-animated.g-orange {
    --_border-gradient: #c20ea1, #dd2d7f, #ee4c5e, #f46d41;
  }
  .border.border-animated.g-purple {
    --_border-gradient: #c11ceb, #6f19b5, #25007a;
  }
  .border.border-animated.g-red {
    --_border-gradient: #e91e63, #d81557, #aa1145;
  }
  .border.border-animated.g-blue {
    --_border-gradient: #148ade, #116ab8;
  }
  .border.border-animated.g-black {
    --_border-gradient: #404040, #212121;
  }
  .border.border-animated.g-indigo {
    --_border-gradient: #715cff, #6851ff;
  }
  .border.border-animated.g-violet {
    --_border-gradient: #8200e7, #bf3eff;
  }
  .border.border-animated.g-body-primary {
    --_border-gradient: var(--theme-on-primary), #382bf0;
  }
  .border.border-animated.g-body-secondary {
    --_border-gradient: var(--theme-on-primary), #ffc107;
  }
  .border.border-animated.g-body-success {
    --_border-gradient: var(--theme-on-primary), #009f42;
  }
  .border.border-animated.g-body-danger {
    --_border-gradient: var(--theme-on-primary), #b41c2b;
  }
}
@layer utilities.colors {
  .text-primary {
    color: var(--theme-primary-a10);
  }
  .text-primary-high-contrast {
    color: var(--theme-primary-a90);
  }
  .text-secondary {
    color: var(--theme-secondary-a10);
  }
  .text-secondary-high-contrast {
    color: var(--theme-secondary-a90);
  }
  .text-accent {
    color: var(--theme-accenta-a10);
  }
  .text-accent-high-contrast {
    color: var(--theme-accent-a90);
  }
  .text-success {
    color: var(--theme-success-a10);
  }
  .text-success-high-contrast {
    color: var(--theme-success-a90);
  }
  .text-warning {
    color: var(--theme-warning-a10);
  }
  .text-warning-high-contrast {
    color: var(--theme-warning-a90);
  }
  .text-danger {
    color: var(--theme-danger-a10);
  }
  .text-danger-high-contrast {
    color: var(--theme-danger-a90);
  }
  .text-muted {
    color: var(--theme-muted-a10);
  }
  .text-muted-high-contrast {
    color: var(--theme-muted-a90);
  }
  .text-white {
    color: hsl(100, 100%, 100%);
  }
  .text-dark {
    color: hsl(0, 0%, 0%);
  }
  .text-red {
    color: hsl(354, 73%, 51%);
  }
  .text-on-primary {
    color: var(--theme-on-primary);
  }
  .text-on-secondary {
    color: var(--theme-on-secondary);
  }
  .text-on-accent {
    color: var(--theme-on-secondary);
  }
  .text-on-success {
    color: var(--theme-on-primary-inverse);
  }
  .text-on-warning {
    color: hsl(0, 0%, 0%);
  }
  .text-on-danger {
    color: var(--theme-on-primary-inverse);
  }
  .text-gradient {
    color: var(--theme-primary-a10);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-image: linear-gradient(45deg, #7319fa, #ff33b4, #ff7e29);
    background-image: -webkit-linear-gradient(45deg, #7319fa, #ff33b4, #ff7e29);
  }
  .text-gradient.g-primary {
    --_badge-gradient-color: hsl(100, 100%, 100%);
    background-image: linear-gradient(45deg, #0023f7, #382bf0);
    background-image: -webkit-linear-gradient(45deg, #0023f7, #382bf0);
  }
  .text-gradient.g-gold {
    background-image: linear-gradient(45deg, #875919, #a87732, #dbaa64, #f0c588);
    background-image: -webkit-linear-gradient(45deg, #875919, #a87732, #dbaa64, #f0c588);
  }
  .text-gradient.g-green {
    background-image: linear-gradient(45deg, #4ae17b, #11d181);
    background-image: -webkit-linear-gradient(45deg, #4ae17b, #11d181);
  }
  .text-gradient.g-cyan {
    background-image: linear-gradient(45deg, #0adeff, #0a81ff);
    background-image: -webkit-linear-gradient(45deg, #0adeff, #0a81ff);
  }
  .text-gradient.g-yellow {
    background-image: linear-gradient(45deg, #ffe572, #c28333);
    background-image: -webkit-linear-gradient(45deg, #ffe572, #c28333);
  }
  .text-gradient.g-orange {
    background-image: linear-gradient(45deg, #c20ea1, #dd2d7f, #ee4c5e, #f46d41);
    background-image: -webkit-linear-gradient(45deg, #c20ea1, #dd2d7f, #ee4c5e, #f46d41);
  }
  .text-gradient.g-purple {
    background-image: linear-gradient(45deg, #c11ceb, #6f19b5, #25007a);
    background-image: -webkit-linear-gradient(45deg, #c11ceb, #6f19b5, #25007a);
  }
  .text-gradient.g-red {
    background-image: linear-gradient(45deg, #e91e63, #d81557, #aa1145);
    background-image: -webkit-linear-gradient(45deg, #e91e63, #d81557, #aa1145);
  }
  .text-gradient.g-blue {
    background-image: linear-gradient(45deg, #148ade, #116ab8);
    background-image: -webkit-linear-gradient(45deg, #148ade, #116ab8);
  }
  .text-gradient.g-black {
    background-image: linear-gradient(45deg, #404040, #212121);
    background-image: -webkit-linear-gradient(45deg, #404040, #212121);
  }
  .text-gradient.g-indigo {
    background-image: linear-gradient(45deg, #715cff, #6851ff);
    background-image: -webkit-linear-gradient(45deg, #715cff, #6851ff);
  }
  .text-gradient.g-violet {
    background-image: linear-gradient(45deg, #8200e7, #bf3eff);
    background-image: -webkit-linear-gradient(45deg, #8200e7, #bf3eff);
  }
  .text-gradient.g-body-primary {
    background-image: linear-gradient(0deg, var(--theme-on-primary), #382bf0);
    background-image: -webkit-linear-gradient(0deg, var(--theme-on-primary), #382bf0);
  }
  .text-gradient.g-body-secondary {
    background-image: linear-gradient(45deg, var(--theme-on-primary), #ffc107);
    background-image: -webkit-linear-gradient(45deg, var(--theme-on-primary), #ffc107);
  }
  .text-gradient.g-body-success {
    background-image: linear-gradient(0deg, var(--theme-on-primary), #009f42);
    background-image: -webkit-linear-gradient(0deg, var(--theme-on-primary), #009f42);
  }
  .text-gradient.g-body-danger {
    background-image: linear-gradient(45deg, var(--theme-on-primary), #b41c2b);
    background-image: -webkit-linear-gradient(45deg, var(--theme-on-primary), #b41c2b);
  }
}
@layer utilities.cursors {
  .cursor-pointer {
    cursor: pointer;
  }
  .cursor-default {
    cursor: default;
  }
  .cursor-help {
    cursor: help;
  }
  .cursor-wait {
    cursor: wait;
  }
  .cursor-grab {
    cursor: grab;
  }
  .cursor-grabbing {
    cursor: grabbing;
  }
}
@layer utilities.display {
  .d-none {
    display: none;
  }
  .d-block {
    display: block;
  }
  .d-inline-block {
    display: inline-block;
  }
  .d-flex {
    display: flex;
  }
  .d-inline-flex {
    display: inline-flex;
  }
  .d-grid {
    display: grid;
  }
  /*
  * Display
  * Generate display utilities for each breakpoint
  */
  @media (min-width: 576px) {
    .d-sm-none {
      display: none;
    }
    .d-sm-block {
      display: block;
    }
    .d-sm-inline-block {
      display: inline-block;
    }
    .d-sm-flex {
      display: flex;
    }
    .d-sm-inline-flex {
      display: inline-flex;
    }
    .d-sm-grid {
      display: grid;
    }
  }
  @media (min-width: 768px) {
    .d-md-none {
      display: none;
    }
    .d-md-block {
      display: block;
    }
    .d-md-inline-block {
      display: inline-block;
    }
    .d-md-flex {
      display: flex;
    }
    .d-md-inline-flex {
      display: inline-flex;
    }
    .d-md-grid {
      display: grid;
    }
  }
  @media (min-width: 992px) {
    .d-lg-none {
      display: none;
    }
    .d-lg-block {
      display: block;
    }
    .d-lg-inline-block {
      display: inline-block;
    }
    .d-lg-flex {
      display: flex;
    }
    .d-lg-inline-flex {
      display: inline-flex;
    }
    .d-lg-grid {
      display: grid;
    }
  }
  @media (min-width: 1200px) {
    .d-xl-none {
      display: none;
    }
    .d-xl-block {
      display: block;
    }
    .d-xl-inline-block {
      display: inline-block;
    }
    .d-xl-flex {
      display: flex;
    }
    .d-xl-inline-flex {
      display: inline-flex;
    }
    .d-xl-grid {
      display: grid;
    }
  }
  @media (min-width: 1400px) {
    .d-xxl-none {
      display: none;
    }
    .d-xxl-block {
      display: block;
    }
    .d-xxl-inline-block {
      display: inline-block;
    }
    .d-xxl-flex {
      display: flex;
    }
    .d-xxl-inline-flex {
      display: inline-flex;
    }
    .d-xxl-grid {
      display: grid;
    }
  }
}
@layer utilities.filter {
  .filter-invert {
    filter: var(--theme-img-filter-invert);
  }
  .filter-grayscale {
    filter: grayscale(100%);
  }
  .filter-sepia {
    filter: sepia(100%);
  }
  .filter-saturate {
    filter: saturate(100%);
  }
  .filter-hue-rotate {
    filter: hue-rotate(90deg);
  }
  .filter-brightness {
    filter: brightness(0.5);
  }
  .filter-contrast {
    filter: contrast(200%);
  }
}
@layer utilities.flex {
  /*
  * Gap
  * Generate gap utilities for each size
  */
  .gap-0 {
    gap: 0;
  }
  .gap-inline-0 {
    column-gap: 0;
  }
  .gap-block-0 {
    row-gap: 0;
  }
  .gap-1 {
    gap: 0.25rem;
  }
  .gap-inline-1 {
    column-gap: 0.25rem;
  }
  .gap-block-1 {
    row-gap: 0.25rem;
  }
  .gap-2 {
    gap: 0.5rem;
  }
  .gap-inline-2 {
    column-gap: 0.5rem;
  }
  .gap-block-2 {
    row-gap: 0.5rem;
  }
  .gap-3 {
    gap: 0.75rem;
  }
  .gap-inline-3 {
    column-gap: 0.75rem;
  }
  .gap-block-3 {
    row-gap: 0.75rem;
  }
  .gap-4 {
    gap: 1rem;
  }
  .gap-inline-4 {
    column-gap: 1rem;
  }
  .gap-block-4 {
    row-gap: 1rem;
  }
  .gap-5 {
    gap: 1.25rem;
  }
  .gap-inline-5 {
    column-gap: 1.25rem;
  }
  .gap-block-5 {
    row-gap: 1.25rem;
  }
  .gap-6 {
    gap: 1.5rem;
  }
  .gap-inline-6 {
    column-gap: 1.5rem;
  }
  .gap-block-6 {
    row-gap: 1.5rem;
  }
  .gap-7 {
    gap: 1.75rem;
  }
  .gap-inline-7 {
    column-gap: 1.75rem;
  }
  .gap-block-7 {
    row-gap: 1.75rem;
  }
  .gap-8 {
    gap: 2rem;
  }
  .gap-inline-8 {
    column-gap: 2rem;
  }
  .gap-block-8 {
    row-gap: 2rem;
  }
  .gap-9 {
    gap: 2.25rem;
  }
  .gap-inline-9 {
    column-gap: 2.25rem;
  }
  .gap-block-9 {
    row-gap: 2.25rem;
  }
  .gap-10 {
    gap: 2.5rem;
  }
  .gap-inline-10 {
    column-gap: 2.5rem;
  }
  .gap-block-10 {
    row-gap: 2.5rem;
  }
  @media (min-width: 576px) {
    .gap-sm-0 {
      gap: 0;
    }
    .gap-inline-sm-0 {
      column-gap: 0;
    }
    .gap-block-sm-0 {
      row-gap: 0;
    }
  }
  @media (min-width: 576px) {
    .gap-sm-1 {
      gap: 0.25rem;
    }
    .gap-inline-sm-1 {
      column-gap: 0.25rem;
    }
    .gap-block-sm-1 {
      row-gap: 0.25rem;
    }
  }
  @media (min-width: 576px) {
    .gap-sm-2 {
      gap: 0.5rem;
    }
    .gap-inline-sm-2 {
      column-gap: 0.5rem;
    }
    .gap-block-sm-2 {
      row-gap: 0.5rem;
    }
  }
  @media (min-width: 576px) {
    .gap-sm-3 {
      gap: 0.75rem;
    }
    .gap-inline-sm-3 {
      column-gap: 0.75rem;
    }
    .gap-block-sm-3 {
      row-gap: 0.75rem;
    }
  }
  @media (min-width: 576px) {
    .gap-sm-4 {
      gap: 1rem;
    }
    .gap-inline-sm-4 {
      column-gap: 1rem;
    }
    .gap-block-sm-4 {
      row-gap: 1rem;
    }
  }
  @media (min-width: 576px) {
    .gap-sm-5 {
      gap: 1.25rem;
    }
    .gap-inline-sm-5 {
      column-gap: 1.25rem;
    }
    .gap-block-sm-5 {
      row-gap: 1.25rem;
    }
  }
  @media (min-width: 576px) {
    .gap-sm-6 {
      gap: 1.5rem;
    }
    .gap-inline-sm-6 {
      column-gap: 1.5rem;
    }
    .gap-block-sm-6 {
      row-gap: 1.5rem;
    }
  }
  @media (min-width: 576px) {
    .gap-sm-7 {
      gap: 1.75rem;
    }
    .gap-inline-sm-7 {
      column-gap: 1.75rem;
    }
    .gap-block-sm-7 {
      row-gap: 1.75rem;
    }
  }
  @media (min-width: 576px) {
    .gap-sm-8 {
      gap: 2rem;
    }
    .gap-inline-sm-8 {
      column-gap: 2rem;
    }
    .gap-block-sm-8 {
      row-gap: 2rem;
    }
  }
  @media (min-width: 576px) {
    .gap-sm-9 {
      gap: 2.25rem;
    }
    .gap-inline-sm-9 {
      column-gap: 2.25rem;
    }
    .gap-block-sm-9 {
      row-gap: 2.25rem;
    }
  }
  @media (min-width: 576px) {
    .gap-sm-10 {
      gap: 2.5rem;
    }
    .gap-inline-sm-10 {
      column-gap: 2.5rem;
    }
    .gap-block-sm-10 {
      row-gap: 2.5rem;
    }
  }
  @media (min-width: 768px) {
    .gap-md-0 {
      gap: 0;
    }
    .gap-inline-md-0 {
      column-gap: 0;
    }
    .gap-block-md-0 {
      row-gap: 0;
    }
  }
  @media (min-width: 768px) {
    .gap-md-1 {
      gap: 0.25rem;
    }
    .gap-inline-md-1 {
      column-gap: 0.25rem;
    }
    .gap-block-md-1 {
      row-gap: 0.25rem;
    }
  }
  @media (min-width: 768px) {
    .gap-md-2 {
      gap: 0.5rem;
    }
    .gap-inline-md-2 {
      column-gap: 0.5rem;
    }
    .gap-block-md-2 {
      row-gap: 0.5rem;
    }
  }
  @media (min-width: 768px) {
    .gap-md-3 {
      gap: 0.75rem;
    }
    .gap-inline-md-3 {
      column-gap: 0.75rem;
    }
    .gap-block-md-3 {
      row-gap: 0.75rem;
    }
  }
  @media (min-width: 768px) {
    .gap-md-4 {
      gap: 1rem;
    }
    .gap-inline-md-4 {
      column-gap: 1rem;
    }
    .gap-block-md-4 {
      row-gap: 1rem;
    }
  }
  @media (min-width: 768px) {
    .gap-md-5 {
      gap: 1.25rem;
    }
    .gap-inline-md-5 {
      column-gap: 1.25rem;
    }
    .gap-block-md-5 {
      row-gap: 1.25rem;
    }
  }
  @media (min-width: 768px) {
    .gap-md-6 {
      gap: 1.5rem;
    }
    .gap-inline-md-6 {
      column-gap: 1.5rem;
    }
    .gap-block-md-6 {
      row-gap: 1.5rem;
    }
  }
  @media (min-width: 768px) {
    .gap-md-7 {
      gap: 1.75rem;
    }
    .gap-inline-md-7 {
      column-gap: 1.75rem;
    }
    .gap-block-md-7 {
      row-gap: 1.75rem;
    }
  }
  @media (min-width: 768px) {
    .gap-md-8 {
      gap: 2rem;
    }
    .gap-inline-md-8 {
      column-gap: 2rem;
    }
    .gap-block-md-8 {
      row-gap: 2rem;
    }
  }
  @media (min-width: 768px) {
    .gap-md-9 {
      gap: 2.25rem;
    }
    .gap-inline-md-9 {
      column-gap: 2.25rem;
    }
    .gap-block-md-9 {
      row-gap: 2.25rem;
    }
  }
  @media (min-width: 768px) {
    .gap-md-10 {
      gap: 2.5rem;
    }
    .gap-inline-md-10 {
      column-gap: 2.5rem;
    }
    .gap-block-md-10 {
      row-gap: 2.5rem;
    }
  }
  @media (min-width: 992px) {
    .gap-lg-0 {
      gap: 0;
    }
    .gap-inline-lg-0 {
      column-gap: 0;
    }
    .gap-block-lg-0 {
      row-gap: 0;
    }
  }
  @media (min-width: 992px) {
    .gap-lg-1 {
      gap: 0.25rem;
    }
    .gap-inline-lg-1 {
      column-gap: 0.25rem;
    }
    .gap-block-lg-1 {
      row-gap: 0.25rem;
    }
  }
  @media (min-width: 992px) {
    .gap-lg-2 {
      gap: 0.5rem;
    }
    .gap-inline-lg-2 {
      column-gap: 0.5rem;
    }
    .gap-block-lg-2 {
      row-gap: 0.5rem;
    }
  }
  @media (min-width: 992px) {
    .gap-lg-3 {
      gap: 0.75rem;
    }
    .gap-inline-lg-3 {
      column-gap: 0.75rem;
    }
    .gap-block-lg-3 {
      row-gap: 0.75rem;
    }
  }
  @media (min-width: 992px) {
    .gap-lg-4 {
      gap: 1rem;
    }
    .gap-inline-lg-4 {
      column-gap: 1rem;
    }
    .gap-block-lg-4 {
      row-gap: 1rem;
    }
  }
  @media (min-width: 992px) {
    .gap-lg-5 {
      gap: 1.25rem;
    }
    .gap-inline-lg-5 {
      column-gap: 1.25rem;
    }
    .gap-block-lg-5 {
      row-gap: 1.25rem;
    }
  }
  @media (min-width: 992px) {
    .gap-lg-6 {
      gap: 1.5rem;
    }
    .gap-inline-lg-6 {
      column-gap: 1.5rem;
    }
    .gap-block-lg-6 {
      row-gap: 1.5rem;
    }
  }
  @media (min-width: 992px) {
    .gap-lg-7 {
      gap: 1.75rem;
    }
    .gap-inline-lg-7 {
      column-gap: 1.75rem;
    }
    .gap-block-lg-7 {
      row-gap: 1.75rem;
    }
  }
  @media (min-width: 992px) {
    .gap-lg-8 {
      gap: 2rem;
    }
    .gap-inline-lg-8 {
      column-gap: 2rem;
    }
    .gap-block-lg-8 {
      row-gap: 2rem;
    }
  }
  @media (min-width: 992px) {
    .gap-lg-9 {
      gap: 2.25rem;
    }
    .gap-inline-lg-9 {
      column-gap: 2.25rem;
    }
    .gap-block-lg-9 {
      row-gap: 2.25rem;
    }
  }
  @media (min-width: 992px) {
    .gap-lg-10 {
      gap: 2.5rem;
    }
    .gap-inline-lg-10 {
      column-gap: 2.5rem;
    }
    .gap-block-lg-10 {
      row-gap: 2.5rem;
    }
  }
  @media (min-width: 1200px) {
    .gap-xl-0 {
      gap: 0;
    }
    .gap-inline-xl-0 {
      column-gap: 0;
    }
    .gap-block-xl-0 {
      row-gap: 0;
    }
  }
  @media (min-width: 1200px) {
    .gap-xl-1 {
      gap: 0.25rem;
    }
    .gap-inline-xl-1 {
      column-gap: 0.25rem;
    }
    .gap-block-xl-1 {
      row-gap: 0.25rem;
    }
  }
  @media (min-width: 1200px) {
    .gap-xl-2 {
      gap: 0.5rem;
    }
    .gap-inline-xl-2 {
      column-gap: 0.5rem;
    }
    .gap-block-xl-2 {
      row-gap: 0.5rem;
    }
  }
  @media (min-width: 1200px) {
    .gap-xl-3 {
      gap: 0.75rem;
    }
    .gap-inline-xl-3 {
      column-gap: 0.75rem;
    }
    .gap-block-xl-3 {
      row-gap: 0.75rem;
    }
  }
  @media (min-width: 1200px) {
    .gap-xl-4 {
      gap: 1rem;
    }
    .gap-inline-xl-4 {
      column-gap: 1rem;
    }
    .gap-block-xl-4 {
      row-gap: 1rem;
    }
  }
  @media (min-width: 1200px) {
    .gap-xl-5 {
      gap: 1.25rem;
    }
    .gap-inline-xl-5 {
      column-gap: 1.25rem;
    }
    .gap-block-xl-5 {
      row-gap: 1.25rem;
    }
  }
  @media (min-width: 1200px) {
    .gap-xl-6 {
      gap: 1.5rem;
    }
    .gap-inline-xl-6 {
      column-gap: 1.5rem;
    }
    .gap-block-xl-6 {
      row-gap: 1.5rem;
    }
  }
  @media (min-width: 1200px) {
    .gap-xl-7 {
      gap: 1.75rem;
    }
    .gap-inline-xl-7 {
      column-gap: 1.75rem;
    }
    .gap-block-xl-7 {
      row-gap: 1.75rem;
    }
  }
  @media (min-width: 1200px) {
    .gap-xl-8 {
      gap: 2rem;
    }
    .gap-inline-xl-8 {
      column-gap: 2rem;
    }
    .gap-block-xl-8 {
      row-gap: 2rem;
    }
  }
  @media (min-width: 1200px) {
    .gap-xl-9 {
      gap: 2.25rem;
    }
    .gap-inline-xl-9 {
      column-gap: 2.25rem;
    }
    .gap-block-xl-9 {
      row-gap: 2.25rem;
    }
  }
  @media (min-width: 1200px) {
    .gap-xl-10 {
      gap: 2.5rem;
    }
    .gap-inline-xl-10 {
      column-gap: 2.5rem;
    }
    .gap-block-xl-10 {
      row-gap: 2.5rem;
    }
  }
  @media (min-width: 1400px) {
    .gap-xxl-0 {
      gap: 0;
    }
    .gap-inline-xxl-0 {
      column-gap: 0;
    }
    .gap-block-xxl-0 {
      row-gap: 0;
    }
  }
  @media (min-width: 1400px) {
    .gap-xxl-1 {
      gap: 0.25rem;
    }
    .gap-inline-xxl-1 {
      column-gap: 0.25rem;
    }
    .gap-block-xxl-1 {
      row-gap: 0.25rem;
    }
  }
  @media (min-width: 1400px) {
    .gap-xxl-2 {
      gap: 0.5rem;
    }
    .gap-inline-xxl-2 {
      column-gap: 0.5rem;
    }
    .gap-block-xxl-2 {
      row-gap: 0.5rem;
    }
  }
  @media (min-width: 1400px) {
    .gap-xxl-3 {
      gap: 0.75rem;
    }
    .gap-inline-xxl-3 {
      column-gap: 0.75rem;
    }
    .gap-block-xxl-3 {
      row-gap: 0.75rem;
    }
  }
  @media (min-width: 1400px) {
    .gap-xxl-4 {
      gap: 1rem;
    }
    .gap-inline-xxl-4 {
      column-gap: 1rem;
    }
    .gap-block-xxl-4 {
      row-gap: 1rem;
    }
  }
  @media (min-width: 1400px) {
    .gap-xxl-5 {
      gap: 1.25rem;
    }
    .gap-inline-xxl-5 {
      column-gap: 1.25rem;
    }
    .gap-block-xxl-5 {
      row-gap: 1.25rem;
    }
  }
  @media (min-width: 1400px) {
    .gap-xxl-6 {
      gap: 1.5rem;
    }
    .gap-inline-xxl-6 {
      column-gap: 1.5rem;
    }
    .gap-block-xxl-6 {
      row-gap: 1.5rem;
    }
  }
  @media (min-width: 1400px) {
    .gap-xxl-7 {
      gap: 1.75rem;
    }
    .gap-inline-xxl-7 {
      column-gap: 1.75rem;
    }
    .gap-block-xxl-7 {
      row-gap: 1.75rem;
    }
  }
  @media (min-width: 1400px) {
    .gap-xxl-8 {
      gap: 2rem;
    }
    .gap-inline-xxl-8 {
      column-gap: 2rem;
    }
    .gap-block-xxl-8 {
      row-gap: 2rem;
    }
  }
  @media (min-width: 1400px) {
    .gap-xxl-9 {
      gap: 2.25rem;
    }
    .gap-inline-xxl-9 {
      column-gap: 2.25rem;
    }
    .gap-block-xxl-9 {
      row-gap: 2.25rem;
    }
  }
  @media (min-width: 1400px) {
    .gap-xxl-10 {
      gap: 2.5rem;
    }
    .gap-inline-xxl-10 {
      column-gap: 2.5rem;
    }
    .gap-block-xxl-10 {
      row-gap: 2.5rem;
    }
  }
  .flex-wrap {
    flex-wrap: wrap;
  }
  .flex-wrap-reverse {
    flex-wrap: wrap-reverse;
  }
  .flex-nowrap {
    flex-wrap: nowrap;
  }
  .flex-row {
    flex-direction: row;
  }
  .flex-row-reverse {
    flex-direction: row-reverse;
  }
  .flex-column {
    flex-direction: column;
  }
  .flex-column-reverse {
    flex-direction: column-reverse;
  }
  .flex-fill {
    flex: 1 1 auto;
  }
  .flex-grow-0 {
    flex-grow: 0;
  }
  .flex-grow-1 {
    flex-grow: 1;
  }
  .flex-shrink-0 {
    flex-shrink: 0;
  }
  .flex-shrink-1 {
    flex-shrink: 1;
  }
  .flex-order-1 {
    order: 1;
  }
  .flex-order-2 {
    order: 2;
  }
  .flex-order-3 {
    order: 3;
  }
  .flex-order-4 {
    order: 4;
  }
  .flex-order-5 {
    order: 5;
  }
  .align-items-start {
    align-items: flex-start;
  }
  .align-items-center {
    align-items: center;
  }
  .align-items-end {
    align-items: flex-end;
  }
  .align-items-baseline {
    align-items: baseline;
  }
  .align-items-stretch {
    align-items: stretch;
  }
  .align-content-start {
    align-content: flex-start;
  }
  .align-content-center {
    align-content: center;
  }
  .align-content-end {
    align-content: flex-end;
  }
  .align-content-between {
    align-content: space-between;
  }
  .align-content-around {
    align-content: space-around;
  }
  .align-self-auto {
    align-self: auto;
  }
  .align-self-start {
    align-self: flex-start;
  }
  .align-self-center {
    align-self: center;
  }
  .align-self-end {
    align-self: flex-end;
  }
  .align-self-stretch {
    align-self: stretch;
  }
  .align-self-baseline {
    align-self: baseline;
  }
  /*
  * Justify
  */
  .justify-content-start {
    justify-content: flex-start;
  }
  .justify-content-center {
    justify-content: center;
  }
  .justify-content-end {
    justify-content: flex-end;
  }
  .justify-content-between {
    justify-content: space-between;
  }
  .justify-content-around {
    justify-content: space-around;
  }
  .justify-content-evenly {
    justify-content: space-evenly;
  }
  .justify-items-start {
    justify-items: start;
  }
  .justify-items-center {
    justify-items: center;
  }
  .justify-items-end {
    justify-items: end;
  }
  .justify-items-stretch {
    justify-items: stretch;
  }
  .justify-self-auto {
    justify-self: auto;
  }
  .justify-self-start {
    justify-self: start;
  }
  .justify-self-center {
    justify-self: center;
  }
  .justify-self-end {
    justify-self: end;
  }
  .justify-self-stretch {
    justify-self: stretch;
  }
  /*
  * Justify
  * Generate justify utilities for each breakpoint
  */
  @media (min-width: 576px) {
    .justify-content-sm-start {
      justify-content: flex-start;
    }
    .justify-content-sm-center {
      justify-content: center;
    }
    .justify-content-sm-end {
      justify-content: flex-end;
    }
    .justify-content-sm-between {
      justify-content: space-between;
    }
    .justify-content-sm-around {
      justify-content: space-around;
    }
    .justify-content-sm-evenly {
      justify-content: space-evenly;
    }
    .justify-items-sm-start {
      justify-items: flex-start;
    }
    .justify-items-sm-center {
      justify-items: center;
    }
    .justify-items-sm-end {
      justify-items: flex-end;
    }
    .justify-items-sm-stretch {
      justify-items: stretch;
    }
    .justify-self-sm-auto {
      justify-self: auto;
    }
    .justify-self-sm-start {
      justify-self: flex-start;
    }
    .justify-self-sm-center {
      justify-self: center;
    }
    .justify-self-sm-end {
      justify-self: flex-end;
    }
  }
  @media (min-width: 768px) {
    .justify-content-md-start {
      justify-content: flex-start;
    }
    .justify-content-md-center {
      justify-content: center;
    }
    .justify-content-md-end {
      justify-content: flex-end;
    }
    .justify-content-md-between {
      justify-content: space-between;
    }
    .justify-content-md-around {
      justify-content: space-around;
    }
    .justify-content-md-evenly {
      justify-content: space-evenly;
    }
    .justify-items-md-start {
      justify-items: flex-start;
    }
    .justify-items-md-center {
      justify-items: center;
    }
    .justify-items-md-end {
      justify-items: flex-end;
    }
    .justify-items-md-stretch {
      justify-items: stretch;
    }
    .justify-self-md-auto {
      justify-self: auto;
    }
    .justify-self-md-start {
      justify-self: flex-start;
    }
    .justify-self-md-center {
      justify-self: center;
    }
    .justify-self-md-end {
      justify-self: flex-end;
    }
  }
  @media (min-width: 992px) {
    .justify-content-lg-start {
      justify-content: flex-start;
    }
    .justify-content-lg-center {
      justify-content: center;
    }
    .justify-content-lg-end {
      justify-content: flex-end;
    }
    .justify-content-lg-between {
      justify-content: space-between;
    }
    .justify-content-lg-around {
      justify-content: space-around;
    }
    .justify-content-lg-evenly {
      justify-content: space-evenly;
    }
    .justify-items-lg-start {
      justify-items: flex-start;
    }
    .justify-items-lg-center {
      justify-items: center;
    }
    .justify-items-lg-end {
      justify-items: flex-end;
    }
    .justify-items-lg-stretch {
      justify-items: stretch;
    }
    .justify-self-lg-auto {
      justify-self: auto;
    }
    .justify-self-lg-start {
      justify-self: flex-start;
    }
    .justify-self-lg-center {
      justify-self: center;
    }
    .justify-self-lg-end {
      justify-self: flex-end;
    }
  }
  @media (min-width: 1200px) {
    .justify-content-xl-start {
      justify-content: flex-start;
    }
    .justify-content-xl-center {
      justify-content: center;
    }
    .justify-content-xl-end {
      justify-content: flex-end;
    }
    .justify-content-xl-between {
      justify-content: space-between;
    }
    .justify-content-xl-around {
      justify-content: space-around;
    }
    .justify-content-xl-evenly {
      justify-content: space-evenly;
    }
    .justify-items-xl-start {
      justify-items: flex-start;
    }
    .justify-items-xl-center {
      justify-items: center;
    }
    .justify-items-xl-end {
      justify-items: flex-end;
    }
    .justify-items-xl-stretch {
      justify-items: stretch;
    }
    .justify-self-xl-auto {
      justify-self: auto;
    }
    .justify-self-xl-start {
      justify-self: flex-start;
    }
    .justify-self-xl-center {
      justify-self: center;
    }
    .justify-self-xl-end {
      justify-self: flex-end;
    }
  }
  @media (min-width: 1400px) {
    .justify-content-xxl-start {
      justify-content: flex-start;
    }
    .justify-content-xxl-center {
      justify-content: center;
    }
    .justify-content-xxl-end {
      justify-content: flex-end;
    }
    .justify-content-xxl-between {
      justify-content: space-between;
    }
    .justify-content-xxl-around {
      justify-content: space-around;
    }
    .justify-content-xxl-evenly {
      justify-content: space-evenly;
    }
    .justify-items-xxl-start {
      justify-items: flex-start;
    }
    .justify-items-xxl-center {
      justify-items: center;
    }
    .justify-items-xxl-end {
      justify-items: flex-end;
    }
    .justify-items-xxl-stretch {
      justify-items: stretch;
    }
    .justify-self-xxl-auto {
      justify-self: auto;
    }
    .justify-self-xxl-start {
      justify-self: flex-start;
    }
    .justify-self-xxl-center {
      justify-self: center;
    }
    .justify-self-xxl-end {
      justify-self: flex-end;
    }
  }
  .place-content-center {
    place-content: center;
  }
  .place-content-start {
    place-content: flex-start;
  }
  .place-content-end {
    place-content: flex-end;
  }
  .place-content-between {
    place-content: space-between;
  }
  .place-content-around {
    place-content: space-around;
  }
  .place-content-evenly {
    place-content: space-evenly;
  }
  .place-items-start {
    place-items: start;
  }
  .place-items-center {
    place-items: center;
  }
  .place-items-end {
    place-items: end;
  }
  .place-items-stretch {
    place-items: stretch;
  }
  .place-self-auto {
    place-self: auto;
  }
  .place-self-start {
    place-self: start;
  }
  .place-self-end {
    place-self: end;
  }
  .place-self-center {
    place-self: center;
  }
  .place-self-stretch {
    place-self: stretch;
  }
}
@layer utilities.opacity {
  /*
  * Opacity
  * Generate opacity utilities for each value
  */
  .opacity-0 {
    --_opacity: 0;
    opacity: 0;
  }
  .opacity-5 {
    --_opacity: 0.05;
    opacity: 0.05;
  }
  .opacity-10 {
    --_opacity: 0.1;
    opacity: 0.1;
  }
  .opacity-20 {
    --_opacity: 0.2;
    opacity: 0.2;
  }
  .opacity-30 {
    --_opacity: 0.3;
    opacity: 0.3;
  }
  .opacity-40 {
    --_opacity: 0.4;
    opacity: 0.4;
  }
  .opacity-50 {
    --_opacity: 0.5;
    opacity: 0.5;
  }
  .opacity-60 {
    --_opacity: 0.6;
    opacity: 0.6;
  }
  .opacity-70 {
    --_opacity: 0.7;
    opacity: 0.7;
  }
  .opacity-80 {
    --_opacity: 0.8;
    opacity: 0.8;
  }
  .opacity-90 {
    --_opacity: 0.9;
    opacity: 0.9;
  }
  .opacity-100 {
    --_opacity: 1;
    opacity: 1;
  }
}
@layer utilities.position {
  .position-static {
    position: static;
  }
  .position-relative {
    position: relative;
  }
  .position-absolute {
    position: absolute;
  }
  .position-fixed {
    position: fixed;
  }
  .position-sticky {
    position: sticky;
  }
  /**
    * Add position utilities for top, right, bottom, and left
   */
  .top-0 {
    top: 0;
  }
  .right-0 {
    right: 0;
  }
  .bottom-0 {
    bottom: 0;
  }
  .left-0 {
    left: 0;
  }
  .top-1 {
    top: 0.25rem;
  }
  .right-1 {
    right: 0.25rem;
  }
  .bottom-1 {
    bottom: 0.25rem;
  }
  .left-1 {
    left: 0.25rem;
  }
  .top-2 {
    top: 0.5rem;
  }
  .right-2 {
    right: 0.5rem;
  }
  .bottom-2 {
    bottom: 0.5rem;
  }
  .left-2 {
    left: 0.5rem;
  }
  .top-3 {
    top: 1rem;
  }
  .right-3 {
    right: 1rem;
  }
  .bottom-3 {
    bottom: 1rem;
  }
  .left-3 {
    left: 1rem;
  }
  .top-4 {
    top: 1.5rem;
  }
  .right-4 {
    right: 1.5rem;
  }
  .bottom-4 {
    bottom: 1.5rem;
  }
  .left-4 {
    left: 1.5rem;
  }
  .top-5 {
    top: 3rem;
  }
  .right-5 {
    right: 3rem;
  }
  .bottom-5 {
    bottom: 3rem;
  }
  .left-5 {
    left: 3rem;
  }
}
@layer utilities.scroll {
  .inline-scroll {
    display: inline-flex;
    flex-direction: row;
    flex-wrap: nowrap;
    white-space: nowrap;
    height: auto;
    width: 100%;
    padding-bottom: 0.35rem;
    overflow-x: auto;
    overflow-y: hidden;
  }
  @supports (mask-image: linear-gradient(90deg, #000, transparent)) {
    .inline-scroll {
      mask: linear-gradient(90deg, #000 95%, transparent);
    }
  }
  .block-scroll {
    --_block-scroll-height: 100%;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    height: var(--_block-scroll-height);
    width: auto;
    padding-bottom: 0.35rem;
    overflow-x: hidden;
    overflow-y: scroll;
  }
}
@layer utilities.shadow {
  .shadow-none {
    box-shadow: none;
  }
  .shadow-sm {
    box-shadow: var(--shadow-sm);
  }
  .shadow-md {
    box-shadow: var(--shadow-md);
  }
  .shadow-lg {
    box-shadow: var(--shadow-lg);
  }
  .shadow-xl {
    box-shadow: var(--shadow-xl);
  }
}
@layer utilities.size {
  .dvh-100 {
    height: 100vh;
  }
  @supports (height: 100dvh) {
    .dvh-100 {
      height: 100dvh;
    }
  }
  .dvw-100 {
    width: 100vw;
  }
  @supports (width: 100dvw) {
    .dvw-100 {
      width: 100dvw;
    }
  }
  .vh-50 {
    height: 50vh;
  }
  .vh-75 {
    height: 75vh;
  }
  .vh-100 {
    height: 100vh;
  }
  .vw-50 {
    width: 50vw;
  }
  .vw-75 {
    width: 75vw;
  }
  .vw-100 {
    width: 100vw;
  }
  .min-vh-100 {
    min-height: 100vh;
  }
  .min-vw-100 {
    min-width: 100vw;
  }
  .max-vh-100 {
    max-height: 100vh;
  }
  .max-vw-100 {
    max-width: 100vw;
  }
  .h-50 {
    height: 50%;
  }
  .h-75 {
    height: 75%;
  }
  .h-100 {
    height: 100%;
  }
  .w-50 {
    width: 50%;
  }
  .w-75 {
    width: 75%;
  }
  .w-100 {
    width: 100%;
  }
  .h-auto {
    height: auto;
  }
  .mh-auto {
    min-height: auto;
  }
  .w-auto {
    width: auto;
  }
  .mw-auto {
    min-width: auto;
  }
}
@layer utilities.spacing {
  /*
  * Spacing
  * Generate margin and padding utilities for each size
  */
  .m-0 {
    margin: 0;
  }
  .mx-0 {
    margin-left: 0;
    margin-right: 0;
  }
  .my-0 {
    margin-top: 0;
    margin-bottom: 0;
  }
  .mt-0 {
    margin-top: 0;
  }
  .me-0 {
    margin-right: 0;
  }
  .mb-0 {
    margin-bottom: 0;
  }
  .ms-0 {
    margin-left: 0;
  }
  .p-0 {
    padding: 0;
  }
  .px-0 {
    padding-left: 0;
    padding-right: 0;
  }
  .py-0 {
    padding-top: 0;
    padding-bottom: 0;
  }
  .pt-0 {
    padding-top: 0;
  }
  .pe-0 {
    padding-right: 0;
  }
  .pb-0 {
    padding-bottom: 0;
  }
  .ps-0 {
    padding-left: 0;
  }
  .m-1 {
    margin: 0.25rem;
  }
  .mx-1 {
    margin-left: 0.25rem;
    margin-right: 0.25rem;
  }
  .my-1 {
    margin-top: 0.25rem;
    margin-bottom: 0.25rem;
  }
  .mt-1 {
    margin-top: 0.25rem;
  }
  .me-1 {
    margin-right: 0.25rem;
  }
  .mb-1 {
    margin-bottom: 0.25rem;
  }
  .ms-1 {
    margin-left: 0.25rem;
  }
  .p-1 {
    padding: 0.25rem;
  }
  .px-1 {
    padding-left: 0.25rem;
    padding-right: 0.25rem;
  }
  .py-1 {
    padding-top: 0.25rem;
    padding-bottom: 0.25rem;
  }
  .pt-1 {
    padding-top: 0.25rem;
  }
  .pe-1 {
    padding-right: 0.25rem;
  }
  .pb-1 {
    padding-bottom: 0.25rem;
  }
  .ps-1 {
    padding-left: 0.25rem;
  }
  .m-2 {
    margin: 0.5rem;
  }
  .mx-2 {
    margin-left: 0.5rem;
    margin-right: 0.5rem;
  }
  .my-2 {
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
  }
  .mt-2 {
    margin-top: 0.5rem;
  }
  .me-2 {
    margin-right: 0.5rem;
  }
  .mb-2 {
    margin-bottom: 0.5rem;
  }
  .ms-2 {
    margin-left: 0.5rem;
  }
  .p-2 {
    padding: 0.5rem;
  }
  .px-2 {
    padding-left: 0.5rem;
    padding-right: 0.5rem;
  }
  .py-2 {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
  }
  .pt-2 {
    padding-top: 0.5rem;
  }
  .pe-2 {
    padding-right: 0.5rem;
  }
  .pb-2 {
    padding-bottom: 0.5rem;
  }
  .ps-2 {
    padding-left: 0.5rem;
  }
  .m-3 {
    margin: 1rem;
  }
  .mx-3 {
    margin-left: 1rem;
    margin-right: 1rem;
  }
  .my-3 {
    margin-top: 1rem;
    margin-bottom: 1rem;
  }
  .mt-3 {
    margin-top: 1rem;
  }
  .me-3 {
    margin-right: 1rem;
  }
  .mb-3 {
    margin-bottom: 1rem;
  }
  .ms-3 {
    margin-left: 1rem;
  }
  .p-3 {
    padding: 1rem;
  }
  .px-3 {
    padding-left: 1rem;
    padding-right: 1rem;
  }
  .py-3 {
    padding-top: 1rem;
    padding-bottom: 1rem;
  }
  .pt-3 {
    padding-top: 1rem;
  }
  .pe-3 {
    padding-right: 1rem;
  }
  .pb-3 {
    padding-bottom: 1rem;
  }
  .ps-3 {
    padding-left: 1rem;
  }
  .m-4 {
    margin: 1.5rem;
  }
  .mx-4 {
    margin-left: 1.5rem;
    margin-right: 1.5rem;
  }
  .my-4 {
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
  }
  .mt-4 {
    margin-top: 1.5rem;
  }
  .me-4 {
    margin-right: 1.5rem;
  }
  .mb-4 {
    margin-bottom: 1.5rem;
  }
  .ms-4 {
    margin-left: 1.5rem;
  }
  .p-4 {
    padding: 1.5rem;
  }
  .px-4 {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }
  .py-4 {
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
  }
  .pt-4 {
    padding-top: 1.5rem;
  }
  .pe-4 {
    padding-right: 1.5rem;
  }
  .pb-4 {
    padding-bottom: 1.5rem;
  }
  .ps-4 {
    padding-left: 1.5rem;
  }
  .m-5 {
    margin: 3rem;
  }
  .mx-5 {
    margin-left: 3rem;
    margin-right: 3rem;
  }
  .my-5 {
    margin-top: 3rem;
    margin-bottom: 3rem;
  }
  .mt-5 {
    margin-top: 3rem;
  }
  .me-5 {
    margin-right: 3rem;
  }
  .mb-5 {
    margin-bottom: 3rem;
  }
  .ms-5 {
    margin-left: 3rem;
  }
  .p-5 {
    padding: 3rem;
  }
  .px-5 {
    padding-left: 3rem;
    padding-right: 3rem;
  }
  .py-5 {
    padding-top: 3rem;
    padding-bottom: 3rem;
  }
  .pt-5 {
    padding-top: 3rem;
  }
  .pe-5 {
    padding-right: 3rem;
  }
  .pb-5 {
    padding-bottom: 3rem;
  }
  .ps-5 {
    padding-left: 3rem;
  }
  @media (min-width: 576px) {
    .m-sm-0 {
      margin: 0;
    }
    .mx-sm-0 {
      margin-left: 0;
      margin-right: 0;
    }
    .my-sm-0 {
      margin-top: 0;
      margin-bottom: 0;
    }
    .mt-sm-0 {
      margin-top: 0;
    }
    .me-sm-0 {
      margin-right: 0;
    }
    .mb-sm-0 {
      margin-bottom: 0;
    }
    .ms-sm-0 {
      margin-left: 0;
    }
    .p-sm-0 {
      padding: 0;
    }
    .px-sm-0 {
      padding-left: 0;
      padding-right: 0;
    }
    .py-sm-0 {
      padding-top: 0;
      padding-bottom: 0;
    }
    .pt-sm-0 {
      padding-top: 0;
    }
    .pe-sm-0 {
      padding-right: 0;
    }
    .pb-sm-0 {
      padding-bottom: 0;
    }
    .ps-sm-0 {
      padding-left: 0;
    }
  }
  @media (min-width: 576px) {
    .m-sm-1 {
      margin: 0.25rem;
    }
    .mx-sm-1 {
      margin-left: 0.25rem;
      margin-right: 0.25rem;
    }
    .my-sm-1 {
      margin-top: 0.25rem;
      margin-bottom: 0.25rem;
    }
    .mt-sm-1 {
      margin-top: 0.25rem;
    }
    .me-sm-1 {
      margin-right: 0.25rem;
    }
    .mb-sm-1 {
      margin-bottom: 0.25rem;
    }
    .ms-sm-1 {
      margin-left: 0.25rem;
    }
    .p-sm-1 {
      padding: 0.25rem;
    }
    .px-sm-1 {
      padding-left: 0.25rem;
      padding-right: 0.25rem;
    }
    .py-sm-1 {
      padding-top: 0.25rem;
      padding-bottom: 0.25rem;
    }
    .pt-sm-1 {
      padding-top: 0.25rem;
    }
    .pe-sm-1 {
      padding-right: 0.25rem;
    }
    .pb-sm-1 {
      padding-bottom: 0.25rem;
    }
    .ps-sm-1 {
      padding-left: 0.25rem;
    }
  }
  @media (min-width: 576px) {
    .m-sm-2 {
      margin: 0.5rem;
    }
    .mx-sm-2 {
      margin-left: 0.5rem;
      margin-right: 0.5rem;
    }
    .my-sm-2 {
      margin-top: 0.5rem;
      margin-bottom: 0.5rem;
    }
    .mt-sm-2 {
      margin-top: 0.5rem;
    }
    .me-sm-2 {
      margin-right: 0.5rem;
    }
    .mb-sm-2 {
      margin-bottom: 0.5rem;
    }
    .ms-sm-2 {
      margin-left: 0.5rem;
    }
    .p-sm-2 {
      padding: 0.5rem;
    }
    .px-sm-2 {
      padding-left: 0.5rem;
      padding-right: 0.5rem;
    }
    .py-sm-2 {
      padding-top: 0.5rem;
      padding-bottom: 0.5rem;
    }
    .pt-sm-2 {
      padding-top: 0.5rem;
    }
    .pe-sm-2 {
      padding-right: 0.5rem;
    }
    .pb-sm-2 {
      padding-bottom: 0.5rem;
    }
    .ps-sm-2 {
      padding-left: 0.5rem;
    }
  }
  @media (min-width: 576px) {
    .m-sm-3 {
      margin: 1rem;
    }
    .mx-sm-3 {
      margin-left: 1rem;
      margin-right: 1rem;
    }
    .my-sm-3 {
      margin-top: 1rem;
      margin-bottom: 1rem;
    }
    .mt-sm-3 {
      margin-top: 1rem;
    }
    .me-sm-3 {
      margin-right: 1rem;
    }
    .mb-sm-3 {
      margin-bottom: 1rem;
    }
    .ms-sm-3 {
      margin-left: 1rem;
    }
    .p-sm-3 {
      padding: 1rem;
    }
    .px-sm-3 {
      padding-left: 1rem;
      padding-right: 1rem;
    }
    .py-sm-3 {
      padding-top: 1rem;
      padding-bottom: 1rem;
    }
    .pt-sm-3 {
      padding-top: 1rem;
    }
    .pe-sm-3 {
      padding-right: 1rem;
    }
    .pb-sm-3 {
      padding-bottom: 1rem;
    }
    .ps-sm-3 {
      padding-left: 1rem;
    }
  }
  @media (min-width: 576px) {
    .m-sm-4 {
      margin: 1.5rem;
    }
    .mx-sm-4 {
      margin-left: 1.5rem;
      margin-right: 1.5rem;
    }
    .my-sm-4 {
      margin-top: 1.5rem;
      margin-bottom: 1.5rem;
    }
    .mt-sm-4 {
      margin-top: 1.5rem;
    }
    .me-sm-4 {
      margin-right: 1.5rem;
    }
    .mb-sm-4 {
      margin-bottom: 1.5rem;
    }
    .ms-sm-4 {
      margin-left: 1.5rem;
    }
    .p-sm-4 {
      padding: 1.5rem;
    }
    .px-sm-4 {
      padding-left: 1.5rem;
      padding-right: 1.5rem;
    }
    .py-sm-4 {
      padding-top: 1.5rem;
      padding-bottom: 1.5rem;
    }
    .pt-sm-4 {
      padding-top: 1.5rem;
    }
    .pe-sm-4 {
      padding-right: 1.5rem;
    }
    .pb-sm-4 {
      padding-bottom: 1.5rem;
    }
    .ps-sm-4 {
      padding-left: 1.5rem;
    }
  }
  @media (min-width: 576px) {
    .m-sm-5 {
      margin: 3rem;
    }
    .mx-sm-5 {
      margin-left: 3rem;
      margin-right: 3rem;
    }
    .my-sm-5 {
      margin-top: 3rem;
      margin-bottom: 3rem;
    }
    .mt-sm-5 {
      margin-top: 3rem;
    }
    .me-sm-5 {
      margin-right: 3rem;
    }
    .mb-sm-5 {
      margin-bottom: 3rem;
    }
    .ms-sm-5 {
      margin-left: 3rem;
    }
    .p-sm-5 {
      padding: 3rem;
    }
    .px-sm-5 {
      padding-left: 3rem;
      padding-right: 3rem;
    }
    .py-sm-5 {
      padding-top: 3rem;
      padding-bottom: 3rem;
    }
    .pt-sm-5 {
      padding-top: 3rem;
    }
    .pe-sm-5 {
      padding-right: 3rem;
    }
    .pb-sm-5 {
      padding-bottom: 3rem;
    }
    .ps-sm-5 {
      padding-left: 3rem;
    }
  }
  @media (min-width: 768px) {
    .m-md-0 {
      margin: 0;
    }
    .mx-md-0 {
      margin-left: 0;
      margin-right: 0;
    }
    .my-md-0 {
      margin-top: 0;
      margin-bottom: 0;
    }
    .mt-md-0 {
      margin-top: 0;
    }
    .me-md-0 {
      margin-right: 0;
    }
    .mb-md-0 {
      margin-bottom: 0;
    }
    .ms-md-0 {
      margin-left: 0;
    }
    .p-md-0 {
      padding: 0;
    }
    .px-md-0 {
      padding-left: 0;
      padding-right: 0;
    }
    .py-md-0 {
      padding-top: 0;
      padding-bottom: 0;
    }
    .pt-md-0 {
      padding-top: 0;
    }
    .pe-md-0 {
      padding-right: 0;
    }
    .pb-md-0 {
      padding-bottom: 0;
    }
    .ps-md-0 {
      padding-left: 0;
    }
  }
  @media (min-width: 768px) {
    .m-md-1 {
      margin: 0.25rem;
    }
    .mx-md-1 {
      margin-left: 0.25rem;
      margin-right: 0.25rem;
    }
    .my-md-1 {
      margin-top: 0.25rem;
      margin-bottom: 0.25rem;
    }
    .mt-md-1 {
      margin-top: 0.25rem;
    }
    .me-md-1 {
      margin-right: 0.25rem;
    }
    .mb-md-1 {
      margin-bottom: 0.25rem;
    }
    .ms-md-1 {
      margin-left: 0.25rem;
    }
    .p-md-1 {
      padding: 0.25rem;
    }
    .px-md-1 {
      padding-left: 0.25rem;
      padding-right: 0.25rem;
    }
    .py-md-1 {
      padding-top: 0.25rem;
      padding-bottom: 0.25rem;
    }
    .pt-md-1 {
      padding-top: 0.25rem;
    }
    .pe-md-1 {
      padding-right: 0.25rem;
    }
    .pb-md-1 {
      padding-bottom: 0.25rem;
    }
    .ps-md-1 {
      padding-left: 0.25rem;
    }
  }
  @media (min-width: 768px) {
    .m-md-2 {
      margin: 0.5rem;
    }
    .mx-md-2 {
      margin-left: 0.5rem;
      margin-right: 0.5rem;
    }
    .my-md-2 {
      margin-top: 0.5rem;
      margin-bottom: 0.5rem;
    }
    .mt-md-2 {
      margin-top: 0.5rem;
    }
    .me-md-2 {
      margin-right: 0.5rem;
    }
    .mb-md-2 {
      margin-bottom: 0.5rem;
    }
    .ms-md-2 {
      margin-left: 0.5rem;
    }
    .p-md-2 {
      padding: 0.5rem;
    }
    .px-md-2 {
      padding-left: 0.5rem;
      padding-right: 0.5rem;
    }
    .py-md-2 {
      padding-top: 0.5rem;
      padding-bottom: 0.5rem;
    }
    .pt-md-2 {
      padding-top: 0.5rem;
    }
    .pe-md-2 {
      padding-right: 0.5rem;
    }
    .pb-md-2 {
      padding-bottom: 0.5rem;
    }
    .ps-md-2 {
      padding-left: 0.5rem;
    }
  }
  @media (min-width: 768px) {
    .m-md-3 {
      margin: 1rem;
    }
    .mx-md-3 {
      margin-left: 1rem;
      margin-right: 1rem;
    }
    .my-md-3 {
      margin-top: 1rem;
      margin-bottom: 1rem;
    }
    .mt-md-3 {
      margin-top: 1rem;
    }
    .me-md-3 {
      margin-right: 1rem;
    }
    .mb-md-3 {
      margin-bottom: 1rem;
    }
    .ms-md-3 {
      margin-left: 1rem;
    }
    .p-md-3 {
      padding: 1rem;
    }
    .px-md-3 {
      padding-left: 1rem;
      padding-right: 1rem;
    }
    .py-md-3 {
      padding-top: 1rem;
      padding-bottom: 1rem;
    }
    .pt-md-3 {
      padding-top: 1rem;
    }
    .pe-md-3 {
      padding-right: 1rem;
    }
    .pb-md-3 {
      padding-bottom: 1rem;
    }
    .ps-md-3 {
      padding-left: 1rem;
    }
  }
  @media (min-width: 768px) {
    .m-md-4 {
      margin: 1.5rem;
    }
    .mx-md-4 {
      margin-left: 1.5rem;
      margin-right: 1.5rem;
    }
    .my-md-4 {
      margin-top: 1.5rem;
      margin-bottom: 1.5rem;
    }
    .mt-md-4 {
      margin-top: 1.5rem;
    }
    .me-md-4 {
      margin-right: 1.5rem;
    }
    .mb-md-4 {
      margin-bottom: 1.5rem;
    }
    .ms-md-4 {
      margin-left: 1.5rem;
    }
    .p-md-4 {
      padding: 1.5rem;
    }
    .px-md-4 {
      padding-left: 1.5rem;
      padding-right: 1.5rem;
    }
    .py-md-4 {
      padding-top: 1.5rem;
      padding-bottom: 1.5rem;
    }
    .pt-md-4 {
      padding-top: 1.5rem;
    }
    .pe-md-4 {
      padding-right: 1.5rem;
    }
    .pb-md-4 {
      padding-bottom: 1.5rem;
    }
    .ps-md-4 {
      padding-left: 1.5rem;
    }
  }
  @media (min-width: 768px) {
    .m-md-5 {
      margin: 3rem;
    }
    .mx-md-5 {
      margin-left: 3rem;
      margin-right: 3rem;
    }
    .my-md-5 {
      margin-top: 3rem;
      margin-bottom: 3rem;
    }
    .mt-md-5 {
      margin-top: 3rem;
    }
    .me-md-5 {
      margin-right: 3rem;
    }
    .mb-md-5 {
      margin-bottom: 3rem;
    }
    .ms-md-5 {
      margin-left: 3rem;
    }
    .p-md-5 {
      padding: 3rem;
    }
    .px-md-5 {
      padding-left: 3rem;
      padding-right: 3rem;
    }
    .py-md-5 {
      padding-top: 3rem;
      padding-bottom: 3rem;
    }
    .pt-md-5 {
      padding-top: 3rem;
    }
    .pe-md-5 {
      padding-right: 3rem;
    }
    .pb-md-5 {
      padding-bottom: 3rem;
    }
    .ps-md-5 {
      padding-left: 3rem;
    }
  }
  @media (min-width: 992px) {
    .m-lg-0 {
      margin: 0;
    }
    .mx-lg-0 {
      margin-left: 0;
      margin-right: 0;
    }
    .my-lg-0 {
      margin-top: 0;
      margin-bottom: 0;
    }
    .mt-lg-0 {
      margin-top: 0;
    }
    .me-lg-0 {
      margin-right: 0;
    }
    .mb-lg-0 {
      margin-bottom: 0;
    }
    .ms-lg-0 {
      margin-left: 0;
    }
    .p-lg-0 {
      padding: 0;
    }
    .px-lg-0 {
      padding-left: 0;
      padding-right: 0;
    }
    .py-lg-0 {
      padding-top: 0;
      padding-bottom: 0;
    }
    .pt-lg-0 {
      padding-top: 0;
    }
    .pe-lg-0 {
      padding-right: 0;
    }
    .pb-lg-0 {
      padding-bottom: 0;
    }
    .ps-lg-0 {
      padding-left: 0;
    }
  }
  @media (min-width: 992px) {
    .m-lg-1 {
      margin: 0.25rem;
    }
    .mx-lg-1 {
      margin-left: 0.25rem;
      margin-right: 0.25rem;
    }
    .my-lg-1 {
      margin-top: 0.25rem;
      margin-bottom: 0.25rem;
    }
    .mt-lg-1 {
      margin-top: 0.25rem;
    }
    .me-lg-1 {
      margin-right: 0.25rem;
    }
    .mb-lg-1 {
      margin-bottom: 0.25rem;
    }
    .ms-lg-1 {
      margin-left: 0.25rem;
    }
    .p-lg-1 {
      padding: 0.25rem;
    }
    .px-lg-1 {
      padding-left: 0.25rem;
      padding-right: 0.25rem;
    }
    .py-lg-1 {
      padding-top: 0.25rem;
      padding-bottom: 0.25rem;
    }
    .pt-lg-1 {
      padding-top: 0.25rem;
    }
    .pe-lg-1 {
      padding-right: 0.25rem;
    }
    .pb-lg-1 {
      padding-bottom: 0.25rem;
    }
    .ps-lg-1 {
      padding-left: 0.25rem;
    }
  }
  @media (min-width: 992px) {
    .m-lg-2 {
      margin: 0.5rem;
    }
    .mx-lg-2 {
      margin-left: 0.5rem;
      margin-right: 0.5rem;
    }
    .my-lg-2 {
      margin-top: 0.5rem;
      margin-bottom: 0.5rem;
    }
    .mt-lg-2 {
      margin-top: 0.5rem;
    }
    .me-lg-2 {
      margin-right: 0.5rem;
    }
    .mb-lg-2 {
      margin-bottom: 0.5rem;
    }
    .ms-lg-2 {
      margin-left: 0.5rem;
    }
    .p-lg-2 {
      padding: 0.5rem;
    }
    .px-lg-2 {
      padding-left: 0.5rem;
      padding-right: 0.5rem;
    }
    .py-lg-2 {
      padding-top: 0.5rem;
      padding-bottom: 0.5rem;
    }
    .pt-lg-2 {
      padding-top: 0.5rem;
    }
    .pe-lg-2 {
      padding-right: 0.5rem;
    }
    .pb-lg-2 {
      padding-bottom: 0.5rem;
    }
    .ps-lg-2 {
      padding-left: 0.5rem;
    }
  }
  @media (min-width: 992px) {
    .m-lg-3 {
      margin: 1rem;
    }
    .mx-lg-3 {
      margin-left: 1rem;
      margin-right: 1rem;
    }
    .my-lg-3 {
      margin-top: 1rem;
      margin-bottom: 1rem;
    }
    .mt-lg-3 {
      margin-top: 1rem;
    }
    .me-lg-3 {
      margin-right: 1rem;
    }
    .mb-lg-3 {
      margin-bottom: 1rem;
    }
    .ms-lg-3 {
      margin-left: 1rem;
    }
    .p-lg-3 {
      padding: 1rem;
    }
    .px-lg-3 {
      padding-left: 1rem;
      padding-right: 1rem;
    }
    .py-lg-3 {
      padding-top: 1rem;
      padding-bottom: 1rem;
    }
    .pt-lg-3 {
      padding-top: 1rem;
    }
    .pe-lg-3 {
      padding-right: 1rem;
    }
    .pb-lg-3 {
      padding-bottom: 1rem;
    }
    .ps-lg-3 {
      padding-left: 1rem;
    }
  }
  @media (min-width: 992px) {
    .m-lg-4 {
      margin: 1.5rem;
    }
    .mx-lg-4 {
      margin-left: 1.5rem;
      margin-right: 1.5rem;
    }
    .my-lg-4 {
      margin-top: 1.5rem;
      margin-bottom: 1.5rem;
    }
    .mt-lg-4 {
      margin-top: 1.5rem;
    }
    .me-lg-4 {
      margin-right: 1.5rem;
    }
    .mb-lg-4 {
      margin-bottom: 1.5rem;
    }
    .ms-lg-4 {
      margin-left: 1.5rem;
    }
    .p-lg-4 {
      padding: 1.5rem;
    }
    .px-lg-4 {
      padding-left: 1.5rem;
      padding-right: 1.5rem;
    }
    .py-lg-4 {
      padding-top: 1.5rem;
      padding-bottom: 1.5rem;
    }
    .pt-lg-4 {
      padding-top: 1.5rem;
    }
    .pe-lg-4 {
      padding-right: 1.5rem;
    }
    .pb-lg-4 {
      padding-bottom: 1.5rem;
    }
    .ps-lg-4 {
      padding-left: 1.5rem;
    }
  }
  @media (min-width: 992px) {
    .m-lg-5 {
      margin: 3rem;
    }
    .mx-lg-5 {
      margin-left: 3rem;
      margin-right: 3rem;
    }
    .my-lg-5 {
      margin-top: 3rem;
      margin-bottom: 3rem;
    }
    .mt-lg-5 {
      margin-top: 3rem;
    }
    .me-lg-5 {
      margin-right: 3rem;
    }
    .mb-lg-5 {
      margin-bottom: 3rem;
    }
    .ms-lg-5 {
      margin-left: 3rem;
    }
    .p-lg-5 {
      padding: 3rem;
    }
    .px-lg-5 {
      padding-left: 3rem;
      padding-right: 3rem;
    }
    .py-lg-5 {
      padding-top: 3rem;
      padding-bottom: 3rem;
    }
    .pt-lg-5 {
      padding-top: 3rem;
    }
    .pe-lg-5 {
      padding-right: 3rem;
    }
    .pb-lg-5 {
      padding-bottom: 3rem;
    }
    .ps-lg-5 {
      padding-left: 3rem;
    }
  }
  @media (min-width: 1200px) {
    .m-xl-0 {
      margin: 0;
    }
    .mx-xl-0 {
      margin-left: 0;
      margin-right: 0;
    }
    .my-xl-0 {
      margin-top: 0;
      margin-bottom: 0;
    }
    .mt-xl-0 {
      margin-top: 0;
    }
    .me-xl-0 {
      margin-right: 0;
    }
    .mb-xl-0 {
      margin-bottom: 0;
    }
    .ms-xl-0 {
      margin-left: 0;
    }
    .p-xl-0 {
      padding: 0;
    }
    .px-xl-0 {
      padding-left: 0;
      padding-right: 0;
    }
    .py-xl-0 {
      padding-top: 0;
      padding-bottom: 0;
    }
    .pt-xl-0 {
      padding-top: 0;
    }
    .pe-xl-0 {
      padding-right: 0;
    }
    .pb-xl-0 {
      padding-bottom: 0;
    }
    .ps-xl-0 {
      padding-left: 0;
    }
  }
  @media (min-width: 1200px) {
    .m-xl-1 {
      margin: 0.25rem;
    }
    .mx-xl-1 {
      margin-left: 0.25rem;
      margin-right: 0.25rem;
    }
    .my-xl-1 {
      margin-top: 0.25rem;
      margin-bottom: 0.25rem;
    }
    .mt-xl-1 {
      margin-top: 0.25rem;
    }
    .me-xl-1 {
      margin-right: 0.25rem;
    }
    .mb-xl-1 {
      margin-bottom: 0.25rem;
    }
    .ms-xl-1 {
      margin-left: 0.25rem;
    }
    .p-xl-1 {
      padding: 0.25rem;
    }
    .px-xl-1 {
      padding-left: 0.25rem;
      padding-right: 0.25rem;
    }
    .py-xl-1 {
      padding-top: 0.25rem;
      padding-bottom: 0.25rem;
    }
    .pt-xl-1 {
      padding-top: 0.25rem;
    }
    .pe-xl-1 {
      padding-right: 0.25rem;
    }
    .pb-xl-1 {
      padding-bottom: 0.25rem;
    }
    .ps-xl-1 {
      padding-left: 0.25rem;
    }
  }
  @media (min-width: 1200px) {
    .m-xl-2 {
      margin: 0.5rem;
    }
    .mx-xl-2 {
      margin-left: 0.5rem;
      margin-right: 0.5rem;
    }
    .my-xl-2 {
      margin-top: 0.5rem;
      margin-bottom: 0.5rem;
    }
    .mt-xl-2 {
      margin-top: 0.5rem;
    }
    .me-xl-2 {
      margin-right: 0.5rem;
    }
    .mb-xl-2 {
      margin-bottom: 0.5rem;
    }
    .ms-xl-2 {
      margin-left: 0.5rem;
    }
    .p-xl-2 {
      padding: 0.5rem;
    }
    .px-xl-2 {
      padding-left: 0.5rem;
      padding-right: 0.5rem;
    }
    .py-xl-2 {
      padding-top: 0.5rem;
      padding-bottom: 0.5rem;
    }
    .pt-xl-2 {
      padding-top: 0.5rem;
    }
    .pe-xl-2 {
      padding-right: 0.5rem;
    }
    .pb-xl-2 {
      padding-bottom: 0.5rem;
    }
    .ps-xl-2 {
      padding-left: 0.5rem;
    }
  }
  @media (min-width: 1200px) {
    .m-xl-3 {
      margin: 1rem;
    }
    .mx-xl-3 {
      margin-left: 1rem;
      margin-right: 1rem;
    }
    .my-xl-3 {
      margin-top: 1rem;
      margin-bottom: 1rem;
    }
    .mt-xl-3 {
      margin-top: 1rem;
    }
    .me-xl-3 {
      margin-right: 1rem;
    }
    .mb-xl-3 {
      margin-bottom: 1rem;
    }
    .ms-xl-3 {
      margin-left: 1rem;
    }
    .p-xl-3 {
      padding: 1rem;
    }
    .px-xl-3 {
      padding-left: 1rem;
      padding-right: 1rem;
    }
    .py-xl-3 {
      padding-top: 1rem;
      padding-bottom: 1rem;
    }
    .pt-xl-3 {
      padding-top: 1rem;
    }
    .pe-xl-3 {
      padding-right: 1rem;
    }
    .pb-xl-3 {
      padding-bottom: 1rem;
    }
    .ps-xl-3 {
      padding-left: 1rem;
    }
  }
  @media (min-width: 1200px) {
    .m-xl-4 {
      margin: 1.5rem;
    }
    .mx-xl-4 {
      margin-left: 1.5rem;
      margin-right: 1.5rem;
    }
    .my-xl-4 {
      margin-top: 1.5rem;
      margin-bottom: 1.5rem;
    }
    .mt-xl-4 {
      margin-top: 1.5rem;
    }
    .me-xl-4 {
      margin-right: 1.5rem;
    }
    .mb-xl-4 {
      margin-bottom: 1.5rem;
    }
    .ms-xl-4 {
      margin-left: 1.5rem;
    }
    .p-xl-4 {
      padding: 1.5rem;
    }
    .px-xl-4 {
      padding-left: 1.5rem;
      padding-right: 1.5rem;
    }
    .py-xl-4 {
      padding-top: 1.5rem;
      padding-bottom: 1.5rem;
    }
    .pt-xl-4 {
      padding-top: 1.5rem;
    }
    .pe-xl-4 {
      padding-right: 1.5rem;
    }
    .pb-xl-4 {
      padding-bottom: 1.5rem;
    }
    .ps-xl-4 {
      padding-left: 1.5rem;
    }
  }
  @media (min-width: 1200px) {
    .m-xl-5 {
      margin: 3rem;
    }
    .mx-xl-5 {
      margin-left: 3rem;
      margin-right: 3rem;
    }
    .my-xl-5 {
      margin-top: 3rem;
      margin-bottom: 3rem;
    }
    .mt-xl-5 {
      margin-top: 3rem;
    }
    .me-xl-5 {
      margin-right: 3rem;
    }
    .mb-xl-5 {
      margin-bottom: 3rem;
    }
    .ms-xl-5 {
      margin-left: 3rem;
    }
    .p-xl-5 {
      padding: 3rem;
    }
    .px-xl-5 {
      padding-left: 3rem;
      padding-right: 3rem;
    }
    .py-xl-5 {
      padding-top: 3rem;
      padding-bottom: 3rem;
    }
    .pt-xl-5 {
      padding-top: 3rem;
    }
    .pe-xl-5 {
      padding-right: 3rem;
    }
    .pb-xl-5 {
      padding-bottom: 3rem;
    }
    .ps-xl-5 {
      padding-left: 3rem;
    }
  }
  @media (min-width: 1400px) {
    .m-xxl-0 {
      margin: 0;
    }
    .mx-xxl-0 {
      margin-left: 0;
      margin-right: 0;
    }
    .my-xxl-0 {
      margin-top: 0;
      margin-bottom: 0;
    }
    .mt-xxl-0 {
      margin-top: 0;
    }
    .me-xxl-0 {
      margin-right: 0;
    }
    .mb-xxl-0 {
      margin-bottom: 0;
    }
    .ms-xxl-0 {
      margin-left: 0;
    }
    .p-xxl-0 {
      padding: 0;
    }
    .px-xxl-0 {
      padding-left: 0;
      padding-right: 0;
    }
    .py-xxl-0 {
      padding-top: 0;
      padding-bottom: 0;
    }
    .pt-xxl-0 {
      padding-top: 0;
    }
    .pe-xxl-0 {
      padding-right: 0;
    }
    .pb-xxl-0 {
      padding-bottom: 0;
    }
    .ps-xxl-0 {
      padding-left: 0;
    }
  }
  @media (min-width: 1400px) {
    .m-xxl-1 {
      margin: 0.25rem;
    }
    .mx-xxl-1 {
      margin-left: 0.25rem;
      margin-right: 0.25rem;
    }
    .my-xxl-1 {
      margin-top: 0.25rem;
      margin-bottom: 0.25rem;
    }
    .mt-xxl-1 {
      margin-top: 0.25rem;
    }
    .me-xxl-1 {
      margin-right: 0.25rem;
    }
    .mb-xxl-1 {
      margin-bottom: 0.25rem;
    }
    .ms-xxl-1 {
      margin-left: 0.25rem;
    }
    .p-xxl-1 {
      padding: 0.25rem;
    }
    .px-xxl-1 {
      padding-left: 0.25rem;
      padding-right: 0.25rem;
    }
    .py-xxl-1 {
      padding-top: 0.25rem;
      padding-bottom: 0.25rem;
    }
    .pt-xxl-1 {
      padding-top: 0.25rem;
    }
    .pe-xxl-1 {
      padding-right: 0.25rem;
    }
    .pb-xxl-1 {
      padding-bottom: 0.25rem;
    }
    .ps-xxl-1 {
      padding-left: 0.25rem;
    }
  }
  @media (min-width: 1400px) {
    .m-xxl-2 {
      margin: 0.5rem;
    }
    .mx-xxl-2 {
      margin-left: 0.5rem;
      margin-right: 0.5rem;
    }
    .my-xxl-2 {
      margin-top: 0.5rem;
      margin-bottom: 0.5rem;
    }
    .mt-xxl-2 {
      margin-top: 0.5rem;
    }
    .me-xxl-2 {
      margin-right: 0.5rem;
    }
    .mb-xxl-2 {
      margin-bottom: 0.5rem;
    }
    .ms-xxl-2 {
      margin-left: 0.5rem;
    }
    .p-xxl-2 {
      padding: 0.5rem;
    }
    .px-xxl-2 {
      padding-left: 0.5rem;
      padding-right: 0.5rem;
    }
    .py-xxl-2 {
      padding-top: 0.5rem;
      padding-bottom: 0.5rem;
    }
    .pt-xxl-2 {
      padding-top: 0.5rem;
    }
    .pe-xxl-2 {
      padding-right: 0.5rem;
    }
    .pb-xxl-2 {
      padding-bottom: 0.5rem;
    }
    .ps-xxl-2 {
      padding-left: 0.5rem;
    }
  }
  @media (min-width: 1400px) {
    .m-xxl-3 {
      margin: 1rem;
    }
    .mx-xxl-3 {
      margin-left: 1rem;
      margin-right: 1rem;
    }
    .my-xxl-3 {
      margin-top: 1rem;
      margin-bottom: 1rem;
    }
    .mt-xxl-3 {
      margin-top: 1rem;
    }
    .me-xxl-3 {
      margin-right: 1rem;
    }
    .mb-xxl-3 {
      margin-bottom: 1rem;
    }
    .ms-xxl-3 {
      margin-left: 1rem;
    }
    .p-xxl-3 {
      padding: 1rem;
    }
    .px-xxl-3 {
      padding-left: 1rem;
      padding-right: 1rem;
    }
    .py-xxl-3 {
      padding-top: 1rem;
      padding-bottom: 1rem;
    }
    .pt-xxl-3 {
      padding-top: 1rem;
    }
    .pe-xxl-3 {
      padding-right: 1rem;
    }
    .pb-xxl-3 {
      padding-bottom: 1rem;
    }
    .ps-xxl-3 {
      padding-left: 1rem;
    }
  }
  @media (min-width: 1400px) {
    .m-xxl-4 {
      margin: 1.5rem;
    }
    .mx-xxl-4 {
      margin-left: 1.5rem;
      margin-right: 1.5rem;
    }
    .my-xxl-4 {
      margin-top: 1.5rem;
      margin-bottom: 1.5rem;
    }
    .mt-xxl-4 {
      margin-top: 1.5rem;
    }
    .me-xxl-4 {
      margin-right: 1.5rem;
    }
    .mb-xxl-4 {
      margin-bottom: 1.5rem;
    }
    .ms-xxl-4 {
      margin-left: 1.5rem;
    }
    .p-xxl-4 {
      padding: 1.5rem;
    }
    .px-xxl-4 {
      padding-left: 1.5rem;
      padding-right: 1.5rem;
    }
    .py-xxl-4 {
      padding-top: 1.5rem;
      padding-bottom: 1.5rem;
    }
    .pt-xxl-4 {
      padding-top: 1.5rem;
    }
    .pe-xxl-4 {
      padding-right: 1.5rem;
    }
    .pb-xxl-4 {
      padding-bottom: 1.5rem;
    }
    .ps-xxl-4 {
      padding-left: 1.5rem;
    }
  }
  @media (min-width: 1400px) {
    .m-xxl-5 {
      margin: 3rem;
    }
    .mx-xxl-5 {
      margin-left: 3rem;
      margin-right: 3rem;
    }
    .my-xxl-5 {
      margin-top: 3rem;
      margin-bottom: 3rem;
    }
    .mt-xxl-5 {
      margin-top: 3rem;
    }
    .me-xxl-5 {
      margin-right: 3rem;
    }
    .mb-xxl-5 {
      margin-bottom: 3rem;
    }
    .ms-xxl-5 {
      margin-left: 3rem;
    }
    .p-xxl-5 {
      padding: 3rem;
    }
    .px-xxl-5 {
      padding-left: 3rem;
      padding-right: 3rem;
    }
    .py-xxl-5 {
      padding-top: 3rem;
      padding-bottom: 3rem;
    }
    .pt-xxl-5 {
      padding-top: 3rem;
    }
    .pe-xxl-5 {
      padding-right: 3rem;
    }
    .pb-xxl-5 {
      padding-bottom: 3rem;
    }
    .ps-xxl-5 {
      padding-left: 3rem;
    }
  }
  .mx-auto {
    margin-inline: auto;
  }
  .my-auto {
    margin-block: auto;
  }
  .m-auto {
    margin: auto;
  }
  .block-spacing-0 {
    padding-block: 0rem calc(0rem * 2);
    scroll-margin-top: calc(0rem * 3.5);
  }
  .block-spacing-1 {
    padding-block: 1rem calc(1rem * 2);
    scroll-margin-top: calc(1rem * 3.5);
  }
  .block-spacing-2 {
    padding-block: 2rem calc(2rem * 2);
    scroll-margin-top: calc(2rem * 3.5);
  }
  .block-spacing-3 {
    padding-block: 3rem calc(3rem * 2);
    scroll-margin-top: calc(3rem * 3.5);
  }
  .block-spacing-4 {
    padding-block: 4rem calc(4rem * 2);
    scroll-margin-top: calc(4rem * 3.5);
  }
  .block-spacing-5 {
    padding-block: 5rem calc(5rem * 2);
    scroll-margin-top: calc(5rem * 3.5);
  }
}
@layer utilities.text {
  .font-primary {
    font-family: "Geist", "Roboto", -apple-system, "Segoe UI", sans-serif;
  }
  .font-secondary {
    font-family: "Mona Sans", "Roboto", -apple-system, "Segoe UI", sans-serif;
  }
  .fs-xl-100 {
    font-size: var(--fs-xl-100);
  }
  .fs-100 {
    font-size: var(--fs-100);
  }
  .fs-200 {
    font-size: var(--fs-200);
  }
  .fs-300 {
    font-size: var(--fs-300);
  }
  .fs-400 {
    font-size: var(--fs-400);
  }
  .fs-500 {
    font-size: var(--fs-500);
  }
  .fs-600 {
    font-size: var(--fs-600);
  }
  .fs-sm-100 {
    font-size: var(--fs-sm-100);
  }
  .fs-sm-200 {
    font-size: var(--fs-sm-200);
  }
  .fs-sm-300 {
    font-size: var(--fs-sm-300);
  }
  .fs-sm-400 {
    font-size: var(--fs-sm-400);
  }
  .fs-sm-500 {
    font-size: var(--fs-sm-500);
  }
  .fw-400 {
    font-weight: 400;
  }
  .fw-500 {
    font-weight: 500;
  }
  .fw-600 {
    font-weight: 600;
  }
  .fw-700 {
    font-weight: 700;
  }
  .fw-800 {
    font-weight: 800;
  }
  .text-left {
    text-align: left;
  }
  .text-start {
    text-align: start;
  }
  .text-center {
    text-align: center;
  }
  .text-right {
    text-align: right;
  }
  .text-end {
    text-align: end;
  }
  .text-wrap {
    white-space: normal;
  }
  .text-nowrap {
    white-space: nowrap;
  }
  .text-break {
    word-wrap: break-word;
    word-break: break-word;
  }
  .text-keep-all {
    word-break: keep-all;
  }
  .text-truncate {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .text-lowercase {
    text-transform: lowercase;
  }
  .text-uppercase {
    text-transform: uppercase;
  }
  .text-capitalize {
    text-transform: capitalize;
  }
  .lh-1 {
    line-height: 1;
  }
  .lh-sm {
    line-height: 1.25;
  }
  .lh-base {
    line-height: 1.5;
  }
  .lh-lg {
    line-height: 2;
  }
  .fl-capitalize {
    text-transform: capitalize;
  }
  .iw-semi-bold {
    font-variation-settings: var(--iw-semi-bold);
  }
  .iw-bold {
    font-variation-settings: var(--iw-bold);
  }
  .ie-low {
    font-variation-settings: var(--ie-low) !important;
  }
  .text-decoration-side-lines {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: 0.75rem;
    align-items: center;
  }
  .text-decoration-side-lines:before, .text-decoration-side-lines:after {
    content: "";
    height: 2px;
    border-radius: 50px;
    background-color: rgba(var(--theme-muted-rgba), 0.55);
  }
  .text-decoration-underline {
    border-bottom: 2px dashed var(--theme-primary-a10);
  }
  .user-select-all {
    user-select: all;
  }
  .user-select-none {
    user-select: none;
  }
  .text-hero {
    font-size: var(--fs-xl-100);
    font-weight: 800;
    line-height: 1.25;
  }
  .text-heading {
    font-size: var(--fs-400);
    font-weight: 600;
    line-height: 1.25;
  }
  .text-heading:is(.heading-lg) {
    font-size: var(--fs-200);
  }
  .text-heading:is(.heading-xl) {
    font-size: var(--fs-xl-100);
  }
  .text-subheading {
    --_text-subheading-gutter: .55rem;
    font-size: var(--fs-500);
    font-weight: 600;
    margin-bottom: var(--_text-subheading-gutter);
    position: relative;
    width: fit-content;
    /* Add support for variable font settings */
  }
  @supports not (font-variation-settings: "wght" 500) {
    .text-subheading {
      font-family: "Mona Sans", "Roboto", -apple-system, "Segoe UI", sans-serif;
    }
  }
  @supports (font-variation-settings: "wght" 500) {
    .text-subheading {
      font-family: "Geist", "Roboto", -apple-system, "Segoe UI", sans-serif;
      font-optical-sizing: auto;
      letter-spacing: -0.15px;
      transition: font-variation-settings 500ms linear(0, 0.00217 0.5%, 0.00866 1.01%, 0.0346 2.07%, 0.0782 3.2%, 0.14066 4.43%, 0.28086 6.651%, 0.72289 12.911%, 0.84164 14.861%, 0.93834 16.722%, 1.01676 18.572%, 1.07743 20.432%, 1.12131 22.332%, 1.1373 23.312%, 1.14934 24.312%, 1.15904 25.603%, 1.16294 26.953%, 1.16113 28.383%, 1.15356 29.933%, 1.14335 31.273%, 1.12887 32.783%, 1.05059 39.614%, 1.01677 43.094%, 1.00206, 0.99057 46.975%, 0.98215 48.945%, 0.9766 50.995%, 0.9735 53.835%, 0.97488 57.056%, 0.9966 69.827%, 1.00329 76.878%, 1.00417 83.808%, 0.99996);
      font-variation-settings: var(--vfs-heading);
    }
  }
  .text-subheading:is(.subheading-m0) {
    --_text-subheading-gutter: 0;
  }
  .text-subheading:is(.subheading-m1) {
    --_text-subheading-gutter: .25rem;
  }
  .text-subheading:is(.subheading-m2) {
    --_text-subheading-gutter: 1rem;
  }
  .text-subheading[data-link*=true] {
    cursor: pointer;
  }
  .text-subheading[data-link*=true]:is(:hover)::before {
    opacity: 1;
    visibility: visible;
  }
  .text-subheading[data-link*=true]::before {
    content: "tag";
    font-family: "Material Symbols Rounded", sans-serif;
    font-variation-settings: "wght" 400;
    font-size: var(--fs-500);
    color: var(--theme-primary-base);
    position: absolute;
    top: 0;
    bottom: 0;
    left: -1.25rem;
    margin: auto;
    opacity: 0;
    visibility: hidden;
    transition: opacity 200ms ease-in-out, visibility 200ms ease-in-out;
  }
  .text-title-description {
    display: inline-block;
    font-size: var(--fs-600);
    font-weight: 600;
  }
  .text-title-description ~ p:is(.subtitle-1) {
    position: relative;
    width: fit-content;
    color: var(--theme-muted-a10);
  }
  .text-title-description ~ p:is(.subtitle-1):after {
    position: absolute;
    content: "";
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 6px;
    background-color: rgba(var(--theme-secondary-rgba), 20%);
    transform-origin: left;
    scale: 0 1;
    transition: scale 200ms cubic-bezier(0.4, 0, 1, 1);
  }
  .text-title-description:is(:hover) ~ p:is(.subtitle-1) {
    color: var(--theme-secondary-a90);
  }
  .text-title-description:is(:hover) ~ p:is(.subtitle-1):after {
    scale: 1 1;
    transition: scale 300ms ease-in-out;
  }
  .text-highlight:is(.highlight-pulse) {
    animation: 500ms ease-in-out zoom-in-out both;
    animation-iteration-count: 3;
  }
}
@layer utilities.transform {
  .rotate-0 {
    rotate: 0deg;
  }
  .rotate-45 {
    rotate: 45deg;
  }
  .rotate-90 {
    rotate: 90deg;
  }
  .rotate-135 {
    rotate: 135deg;
  }
  .rotate-180 {
    rotate: 180deg;
  }
  .rotate-225 {
    rotate: 225deg;
  }
  .rotate-270 {
    rotate: 270deg;
  }
  .rotate-315 {
    rotate: 315deg;
  }
  .rotate-360 {
    rotate: 360deg;
  }
  .translate-x-0 {
    translate: 0 0;
  }
  .translate-x--0 {
    translate: -0 0;
  }
  .translate-y-0 {
    translate: 0 0;
  }
  .translate-y--0 {
    translate: 0 -0;
  }
  .translate-x-1 {
    translate: 0.25rem 0;
  }
  .translate-x--1 {
    translate: -0.25rem 0;
  }
  .translate-y-1 {
    translate: 0 0.25rem;
  }
  .translate-y--1 {
    translate: 0 -0.25rem;
  }
  .translate-x-2 {
    translate: 0.5rem 0;
  }
  .translate-x--2 {
    translate: -0.5rem 0;
  }
  .translate-y-2 {
    translate: 0 0.5rem;
  }
  .translate-y--2 {
    translate: 0 -0.5rem;
  }
  .translate-x-3 {
    translate: 1rem 0;
  }
  .translate-x--3 {
    translate: -1rem 0;
  }
  .translate-y-3 {
    translate: 0 1rem;
  }
  .translate-y--3 {
    translate: 0 -1rem;
  }
  .translate-x-4 {
    translate: 1.5rem 0;
  }
  .translate-x--4 {
    translate: -1.5rem 0;
  }
  .translate-y-4 {
    translate: 0 1.5rem;
  }
  .translate-y--4 {
    translate: 0 -1.5rem;
  }
  .translate-x-5 {
    translate: 3rem 0;
  }
  .translate-x--5 {
    translate: -3rem 0;
  }
  .translate-y-5 {
    translate: 0 3rem;
  }
  .translate-y--5 {
    translate: 0 -3rem;
  }
  .scale-0 {
    scale: 0;
  }
  .scale-1 {
    scale: 0.25;
  }
  .scale-2 {
    scale: 0.5;
  }
  .scale-3 {
    scale: 0.75;
  }
  .scale-4 {
    scale: 1;
  }
  .scale-5 {
    scale: 1.25;
  }
}
@layer utilities.visibility {
  .visibility-hidden {
    visibility: hidden;
  }
  .visibility-visible {
    visibility: visible;
  }
}
@layer utilities.z-index {
  .z-0 {
    z-index: 0;
  }
  .z-1 {
    z-index: 1;
  }
  .z-2 {
    z-index: 2;
  }
  .z-5 {
    z-index: 5;
  }
  .z-99 {
    z-index: 99;
  }
  .z-100 {
    z-index: 100;
  }
  .z-999 {
    z-index: 999;
  }
  .z-1000 {
    z-index: 1000;
  }
}

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