/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
@layer properties {
  @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
    *, :before, :after, ::backdrop {
      --tw-border-style: solid;
      --tw-leading: initial;
      --tw-font-weight: initial;
      --tw-tracking: initial;
      --tw-blur: initial;
      --tw-brightness: initial;
      --tw-contrast: initial;
      --tw-grayscale: initial;
      --tw-hue-rotate: initial;
      --tw-invert: initial;
      --tw-opacity: initial;
      --tw-saturate: initial;
      --tw-sepia: initial;
      --tw-drop-shadow: initial;
      --tw-drop-shadow-color: initial;
      --tw-drop-shadow-alpha: 100%;
      --tw-drop-shadow-size: initial;
      --tw-shadow: 0 0 #0000;
      --tw-shadow-color: initial;
      --tw-shadow-alpha: 100%;
      --tw-inset-shadow: 0 0 #0000;
      --tw-inset-shadow-color: initial;
      --tw-inset-shadow-alpha: 100%;
      --tw-ring-color: initial;
      --tw-ring-shadow: 0 0 #0000;
      --tw-inset-ring-color: initial;
      --tw-inset-ring-shadow: 0 0 #0000;
      --tw-ring-inset: initial;
      --tw-ring-offset-width: 0px;
      --tw-ring-offset-color: #fff;
      --tw-ring-offset-shadow: 0 0 #0000;
      --tw-duration: initial;
      --tw-ease: initial;
      --tw-backdrop-blur: initial;
      --tw-backdrop-brightness: initial;
      --tw-backdrop-contrast: initial;
      --tw-backdrop-grayscale: initial;
      --tw-backdrop-hue-rotate: initial;
      --tw-backdrop-invert: initial;
      --tw-backdrop-opacity: initial;
      --tw-backdrop-saturate: initial;
      --tw-backdrop-sepia: initial;
      --tw-translate-x: 0;
      --tw-translate-y: 0;
      --tw-translate-z: 0;
      --tw-scale-x: 1;
      --tw-scale-y: 1;
      --tw-scale-z: 1;
      --tw-content: "";
      --tw-gradient-position: initial;
      --tw-gradient-from: #0000;
      --tw-gradient-via: #0000;
      --tw-gradient-to: #0000;
      --tw-gradient-stops: initial;
      --tw-gradient-via-stops: initial;
      --tw-gradient-from-position: 0%;
      --tw-gradient-via-position: 50%;
      --tw-gradient-to-position: 100%;
      --tw-ordinal: initial;
      --tw-slashed-zero: initial;
      --tw-numeric-figure: initial;
      --tw-numeric-spacing: initial;
      --tw-numeric-fraction: initial;
      --tw-outline-style: solid;
    }
  }
}

@layer theme {
  :root, :host {
    --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New",
    monospace;
    --color-red-100: oklch(93.6% .032 17.717);
    --color-red-200: oklch(88.5% .062 18.334);
    --color-red-300: oklch(80.8% .114 19.571);
    --color-red-400: oklch(70.4% .191 22.216);
    --color-red-500: oklch(63.7% .237 25.331);
    --color-red-700: oklch(50.5% .213 27.518);
    --color-red-800: oklch(44.4% .177 26.899);
    --color-red-950: oklch(25.8% .092 26.042);
    --color-orange-400: oklch(75% .183 55.934);
    --color-orange-600: oklch(64.6% .222 41.116);
    --color-amber-100: oklch(96.2% .059 95.617);
    --color-amber-200: oklch(92.4% .12 95.746);
    --color-amber-300: oklch(87.9% .169 91.605);
    --color-amber-400: oklch(82.8% .189 84.429);
    --color-amber-500: oklch(76.9% .188 70.08);
    --color-amber-700: oklch(55.5% .163 48.998);
    --color-amber-800: oklch(47.3% .137 46.201);
    --color-amber-950: oklch(27.9% .077 45.635);
    --color-green-200: oklch(92.5% .084 155.995);
    --color-green-300: oklch(87.1% .15 154.449);
    --color-green-400: oklch(79.2% .209 151.711);
    --color-green-500: oklch(72.3% .219 149.579);
    --color-green-600: oklch(62.7% .194 149.214);
    --color-green-700: oklch(52.7% .154 150.069);
    --color-green-800: oklch(44.8% .119 151.328);
    --color-green-900: oklch(39.3% .095 152.535);
    --color-green-950: oklch(26.6% .065 152.934);
    --color-blue-100: oklch(93.2% .032 255.585);
    --color-blue-200: oklch(88.2% .059 254.128);
    --color-blue-300: oklch(80.9% .105 251.813);
    --color-blue-400: oklch(70.7% .165 254.624);
    --color-blue-500: oklch(62.3% .214 259.815);
    --color-blue-600: oklch(54.6% .245 262.881);
    --color-blue-700: oklch(48.8% .243 264.376);
    --color-blue-800: oklch(42.4% .199 265.638);
    --color-blue-950: oklch(28.2% .091 267.935);
    --color-purple-400: oklch(71.4% .203 305.504);
    --color-purple-600: oklch(55.8% .288 302.321);
    --color-slate-100: oklch(96.8% .007 247.896);
    --color-slate-200: oklch(92.9% .013 255.508);
    --color-slate-300: oklch(86.9% .022 252.894);
    --color-slate-400: oklch(70.4% .04 256.788);
    --color-slate-500: oklch(55.4% .046 257.417);
    --color-slate-700: oklch(37.2% .044 257.287);
    --color-slate-800: oklch(27.9% .041 260.031);
    --color-neutral-50: oklch(98.5% 0 none);
    --color-neutral-400: oklch(70.8% 0 none);
    --color-neutral-950: oklch(14.5% 0 none);
    --color-black: #000;
    --color-white: #fff;
    --spacing: .25rem;
    --container-sm: 24rem;
    --container-lg: 32rem;
    --container-7xl: 80rem;
    --text-xs: .75rem;
    --text-xs--line-height: calc(1 / .75);
    --text-sm: .875rem;
    --text-sm--line-height: calc(1.25 / .875);
    --text-base: 1rem;
    --text-base--line-height: calc(1.5 / 1);
    --text-lg: 1.125rem;
    --text-lg--line-height: calc(1.75 / 1.125);
    --text-xl: 1.25rem;
    --text-xl--line-height: calc(1.75 / 1.25);
    --text-2xl: 1.5rem;
    --text-2xl--line-height: calc(2 / 1.5);
    --font-weight-normal: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
    --tracking-tight: -.025em;
    --tracking-wide: .025em;
    --leading-tight: 1.25;
    --leading-snug: 1.375;
    --leading-normal: 1.5;
    --leading-relaxed: 1.625;
    --radius-md: calc(var(--radius) * .8);
    --animate-spin: spin 1s linear infinite;
    --animate-pulse: pulse 2s cubic-bezier(.4, 0, .6, 1) infinite;
    --blur-xs: 4px;
    --default-transition-duration: .15s;
    --default-transition-timing-function: cubic-bezier(.4, 0, .2, 1);
    --default-font-family: "Inter Variable", sans-serif;
    --default-mono-font-family: var(--font-mono);
    --color-primary: var(--primary);
  }
}

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

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

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

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

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

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

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

  b, strong {
    font-weight: bolder;
  }

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

  small {
    font-size: 80%;
  }

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

  sub {
    bottom: -.25em;
  }

  sup {
    top: -.5em;
  }

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

  :-moz-focusring:where(:not(iframe)) {
    outline: auto;
  }

  progress {
    vertical-align: baseline;
  }

  summary {
    display: list-item;
  }

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

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

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

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

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

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

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

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

  ::placeholder {
    opacity: 1;
  }

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

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

  textarea {
    resize: vertical;
  }

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

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

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

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

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

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

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

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

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

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

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

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

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

  ::-webkit-calendar-picker-indicator {
    line-height: 1;
  }

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

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

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

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

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

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

  * {
    border-color: var(--border);
    outline-color: var(--ring);
  }

  @supports (color: color-mix(in lab, red, red)) {
    * {
      outline-color: color-mix(in oklab, var(--ring) 50%, transparent);
    }
  }

  body {
    background-color: var(--background);
    color: var(--foreground);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-family: Inter Variable, sans-serif;
  }

  a:not([class]) {
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    text-underline-offset: 4px;
  }

  @media (hover: hover) {
    a:not([class]):hover {
      text-decoration-line: underline;
    }
  }

  code {
    border-radius: calc(var(--radius) * .6);
    background-color: var(--muted);
    font-family: var(--font-mono);
    padding-block: .1rem;
    padding-inline: .3rem;
    font-size: .85em;
  }

  pre code {
    background-color: #0000;
    border-radius: 0;
    padding: 0;
    font-size: 1em;
  }

  label {
    align-items: center;
    gap: calc(var(--spacing) * 2);
    width: fit-content;
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-leading: var(--leading-snug);
    line-height: var(--leading-snug);
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    -webkit-user-select: none;
    user-select: none;
    display: flex;
  }

  input:not([type="radio"], [type="checkbox"], [type="hidden"]), textarea, select {
    border-radius: calc(var(--radius) * .8);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--input);
    width: 100%;
    min-width: 0;
    font-size: var(--text-base);
    line-height: var(--tw-leading, var(--text-base--line-height));
    --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color, #0000000d);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    transition-property: color, box-shadow;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-outline-style: none;
    background-color: #0000;
    outline-style: none;
  }

  :is(input:not([type="radio"], [type="checkbox"], [type="hidden"]), textarea, select)::placeholder {
    color: var(--muted-foreground);
  }

  :is(input:not([type="radio"], [type="checkbox"], [type="hidden"]), textarea, select):user-invalid {
    border-color: var(--destructive);
  }

  :is(input:not([type="radio"], [type="checkbox"], [type="hidden"]), textarea, select):user-invalid {
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  :is(input:not([type="radio"], [type="checkbox"], [type="hidden"]), textarea, select):user-invalid {
    --tw-ring-color: var(--destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :is(input:not([type="radio"], [type="checkbox"], [type="hidden"]), textarea, select):user-invalid {
      --tw-ring-color: color-mix(in oklab, var(--destructive) 20%, transparent);
    }
  }

  :is(input:not([type="radio"], [type="checkbox"], [type="hidden"]), textarea, select):focus-visible {
    border-color: var(--ring);
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    --tw-ring-color: var(--ring);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :is(input:not([type="radio"], [type="checkbox"], [type="hidden"]), textarea, select):focus-visible {
      --tw-ring-color: color-mix(in oklab, var(--ring) 50%, transparent);
    }
  }

  :is(input:not([type="radio"], [type="checkbox"], [type="hidden"]), textarea, select):disabled {
    pointer-events: none;
    cursor: not-allowed;
    opacity: .5;
  }

  @media (min-width: 48rem) {
    input:not([type="radio"], [type="checkbox"], [type="hidden"]), textarea, select {
      font-size: var(--text-sm);
      line-height: var(--tw-leading, var(--text-sm--line-height));
    }
  }

  :is(input:not([type="radio"], [type="checkbox"], [type="hidden"]), textarea, select):where(.dark, .dark *) {
    background-color: var(--input);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :is(input:not([type="radio"], [type="checkbox"], [type="hidden"]), textarea, select):where(.dark, .dark *) {
      background-color: color-mix(in oklab, var(--input) 30%, transparent);
    }
  }

  @media (prefers-color-scheme: dark) {
    :is(input:not([type="radio"], [type="checkbox"], [type="hidden"]), textarea, select):where(:root:not(.light), :root:not(.light) *) {
      background-color: var(--input);
    }

    @supports (color: color-mix(in lab, red, red)) {
      :is(input:not([type="radio"], [type="checkbox"], [type="hidden"]), textarea, select):where(:root:not(.light), :root:not(.light) *) {
        background-color: color-mix(in oklab, var(--input) 30%, transparent);
      }
    }
  }

  :is(input:not([type="radio"], [type="checkbox"], [type="hidden"]), textarea, select):where(.dark, .dark *):user-invalid {
    border-color: var(--destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :is(input:not([type="radio"], [type="checkbox"], [type="hidden"]), textarea, select):where(.dark, .dark *):user-invalid {
      border-color: color-mix(in oklab, var(--destructive) 50%, transparent);
    }
  }

  @media (prefers-color-scheme: dark) {
    :is(input:not([type="radio"], [type="checkbox"], [type="hidden"]), textarea, select):where(:root:not(.light), :root:not(.light) *):user-invalid {
      border-color: var(--destructive);
    }

    @supports (color: color-mix(in lab, red, red)) {
      :is(input:not([type="radio"], [type="checkbox"], [type="hidden"]), textarea, select):where(:root:not(.light), :root:not(.light) *):user-invalid {
        border-color: color-mix(in oklab, var(--destructive) 50%, transparent);
      }
    }
  }

  :is(input:not([type="radio"], [type="checkbox"], [type="hidden"]), textarea, select):where(.dark, .dark *):user-invalid {
    --tw-ring-color: var(--destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :is(input:not([type="radio"], [type="checkbox"], [type="hidden"]), textarea, select):where(.dark, .dark *):user-invalid {
      --tw-ring-color: color-mix(in oklab, var(--destructive) 40%, transparent);
    }
  }

  @media (prefers-color-scheme: dark) {
    :is(input:not([type="radio"], [type="checkbox"], [type="hidden"]), textarea, select):where(:root:not(.light), :root:not(.light) *):user-invalid {
      --tw-ring-color: var(--destructive);
    }

    @supports (color: color-mix(in lab, red, red)) {
      :is(input:not([type="radio"], [type="checkbox"], [type="hidden"]), textarea, select):where(:root:not(.light), :root:not(.light) *):user-invalid {
        --tw-ring-color: color-mix(in oklab, var(--destructive) 40%, transparent);
      }
    }
  }

  input:not([type="radio"], [type="checkbox"], [type="hidden"]) {
    height: calc(var(--spacing) * 9);
    padding-inline: calc(var(--spacing) * 2.5);
    padding-block: var(--spacing);
  }

  textarea {
    field-sizing: content;
    min-height: calc(var(--spacing) * 16);
    padding-inline: calc(var(--spacing) * 2.5);
    padding-block: calc(var(--spacing) * 2);
  }

  select {
    height: calc(var(--spacing) * 9);
    cursor: pointer;
    appearance: none;
    padding-block: var(--spacing);
    padding-right: calc(var(--spacing) * 8);
    padding-left: calc(var(--spacing) * 2.5);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
  }

  @media (hover: hover) {
    select:where(.dark, .dark *):hover {
      background-color: var(--input);
    }

    @supports (color: color-mix(in lab, red, red)) {
      select:where(.dark, .dark *):hover {
        background-color: color-mix(in oklab, var(--input) 50%, transparent);
      }
    }
  }

  @media (prefers-color-scheme: dark) {
    @media (hover: hover) {
      select:where(:root:not(.light), :root:not(.light) *):hover {
        background-color: var(--input);
      }

      @supports (color: color-mix(in lab, red, red)) {
        select:where(:root:not(.light), :root:not(.light) *):hover {
          background-color: color-mix(in oklab, var(--input) 50%, transparent);
        }
      }
    }
  }

  option {
    color: canvastext;
    background-color: canvas;
  }

  input[type="radio"] {
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
    cursor: pointer;
    appearance: none;
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--input);
    --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color, #0000000d);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    --tw-outline-style: none;
    border-radius: 3.40282e38px;
    outline-style: none;
    flex-shrink: 0;
    position: relative;
  }

  input[type="radio"]:checked {
    border-color: var(--primary);
    background-color: var(--primary-foreground);
    --tw-shadow: inset 0 0 0 3px var(--tw-shadow-color, var(--color-primary));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  input[type="radio"]:focus-visible {
    border-color: var(--ring);
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    --tw-ring-color: var(--ring);
  }

  @supports (color: color-mix(in lab, red, red)) {
    input[type="radio"]:focus-visible {
      --tw-ring-color: color-mix(in oklab, var(--ring) 50%, transparent);
    }
  }

  input[type="radio"]:disabled {
    cursor: not-allowed;
    opacity: .5;
  }

  input[type="radio"]:where(.dark, .dark *) {
    background-color: var(--input);
  }

  @supports (color: color-mix(in lab, red, red)) {
    input[type="radio"]:where(.dark, .dark *) {
      background-color: color-mix(in oklab, var(--input) 30%, transparent);
    }
  }

  @media (prefers-color-scheme: dark) {
    input[type="radio"]:where(:root:not(.light), :root:not(.light) *) {
      background-color: var(--input);
    }

    @supports (color: color-mix(in lab, red, red)) {
      input[type="radio"]:where(:root:not(.light), :root:not(.light) *) {
        background-color: color-mix(in oklab, var(--input) 30%, transparent);
      }
    }
  }

  fieldset {
    gap: calc(var(--spacing) * 4);
    flex-direction: column;
    min-width: 0;
    display: flex;
  }

  legend {
    margin-bottom: calc(var(--spacing) * 3);
    font-size: var(--text-base);
    line-height: var(--tw-leading, var(--text-base--line-height));
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
  }

  summary, button {
    cursor: pointer;
  }
}

@layer components {
  .icon {
    width: 1rem;
    height: 1rem;
    -webkit-mask: var(--icon) center / contain no-repeat;
    -webkit-mask: var(--icon) center / contain no-repeat;
    mask: var(--icon) center / contain no-repeat;
    background-color: currentColor;
    flex-shrink: 0;
    display: inline-block;
  }

  @media (forced-colors: active) {
    .icon {
      background-color: canvastext;
    }
  }

  .i-arrow-right {
    --icon: url("/static/icons/arrow-right.svg");
  }

  .i-boxes {
    --icon: url("/static/icons/boxes.svg");
  }

  .i-building-2 {
    --icon: url("/static/icons/building-2.svg");
  }

  .i-check {
    --icon: url("/static/icons/check.svg");
  }

  .i-circle-alert {
    --icon: url("/static/icons/circle-alert.svg");
  }

  .i-chevron-right {
    --icon: url("/static/icons/chevron-right.svg");
  }

  .i-chevrons-up-down {
    --icon: url("/static/icons/chevrons-up-down.svg");
  }

  .i-cloud {
    --icon: url("/static/icons/cloud.svg");
  }

  .i-external-link {
    --icon: url("/static/icons/external-link.svg");
  }

  .i-layers {
    --icon: url("/static/icons/layers.svg");
  }

  .i-layout-dashboard {
    --icon: url("/static/icons/layout-dashboard.svg");
  }

  .i-layout-grid {
    --icon: url("/static/icons/layout-grid.svg");
  }

  .i-log-out {
    --icon: url("/static/icons/log-out.svg");
  }

  .i-monitor {
    --icon: url("/static/icons/monitor.svg");
  }

  .i-moon {
    --icon: url("/static/icons/moon.svg");
  }

  .i-panel-left {
    --icon: url("/static/icons/panel-left.svg");
  }

  .i-plus {
    --icon: url("/static/icons/plus.svg");
  }

  .i-refresh-cw {
    --icon: url("/static/icons/refresh-cw.svg");
  }

  .i-rocket {
    --icon: url("/static/icons/rocket.svg");
  }

  .i-server {
    --icon: url("/static/icons/server.svg");
  }

  .i-settings {
    --icon: url("/static/icons/settings.svg");
  }

  .i-sun {
    --icon: url("/static/icons/sun.svg");
  }

  .i-trash-2 {
    --icon: url("/static/icons/trash-2.svg");
  }

  .i-user {
    --icon: url("/static/icons/user.svg");
  }

  .sidebar-wrapper {
    width: 100%;
    min-height: 100svh;
    display: flex;
  }

  .sidebar {
    z-index: 20;
    height: 100svh;
    width: var(--sidebar-width);
    border-right-style: var(--tw-border-style);
    background-color: var(--sidebar);
    color: var(--sidebar-foreground);
    transition-property: width;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-duration: .2s;
    --tw-ease: linear;
    border-right-width: 1px;
    flex-direction: column;
    flex-shrink: 0;
    transition-duration: .2s;
    transition-timing-function: linear;
    display: none;
    position: sticky;
    top: 0;
  }

  @media (min-width: 48rem) {
    .sidebar {
      display: flex;
    }
  }

  @media not all and (min-width: 48rem) {
    .sidebar-toggle:checked ~ .sidebar {
      z-index: 50;
      width: calc(var(--spacing) * 72);
      --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, #0000001a), 0 4px 6px -4px var(--tw-shadow-color, #0000001a);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
      inset-block: 0;
      display: flex;
      position: fixed;
      left: 0;
    }
  }

  .sidebar-overlay {
    display: none;
  }

  @media not all and (min-width: 48rem) {
    .sidebar-toggle:checked ~ .sidebar-overlay {
      z-index: 40;
      background-color: #0000001a;
      display: block;
      position: fixed;
      inset: 0;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .sidebar-toggle:checked ~ .sidebar-overlay {
        background-color: color-mix(in oklab, var(--color-black) 10%, transparent);
      }
    }

    .sidebar-toggle:checked ~ .sidebar-overlay {
      --tw-backdrop-blur: blur(var(--blur-xs));
      -webkit-backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
      backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
    }
  }

  .sidebar-toggle:focus-visible ~ .sidebar-inset .sidebar-trigger[for="sidebar-toggle"], .sidebar-collapse:focus-visible ~ .sidebar-inset .sidebar-trigger[for="sidebar-collapse"] {
    border-color: var(--ring);
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    --tw-ring-color: var(--ring);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .sidebar-toggle:focus-visible ~ .sidebar-inset .sidebar-trigger[for="sidebar-toggle"], .sidebar-collapse:focus-visible ~ .sidebar-inset .sidebar-trigger[for="sidebar-collapse"] {
      --tw-ring-color: color-mix(in oklab, var(--ring) 50%, transparent);
    }
  }

  @media (min-width: 48rem) {
    .sidebar-collapse:checked ~ .sidebar {
      width: var(--sidebar-width-icon);
    }

    .sidebar-collapse:checked ~ .sidebar .sidebar-content {
      overflow: visible;
    }

    .sidebar-collapse:checked ~ .sidebar .sidebar-menu-button {
      width: calc(var(--spacing) * 8);
      height: calc(var(--spacing) * 8);
      padding: calc(var(--spacing) * 2);
    }

    .sidebar-collapse:checked ~ .sidebar .sidebar-menu-button.lg {
      padding: 0;
    }

    .sidebar-collapse:checked ~ .sidebar .sidebar-menu > li {
      position: relative;
    }

    .sidebar-collapse:checked ~ .sidebar .sidebar-menu > li > .sidebar-menu-button:is(:hover, :focus-visible) > span:last-child {
      z-index: 50;
      margin-left: calc(var(--spacing) * 2);
      --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
      translate: var(--tw-translate-x) var(--tw-translate-y);
      border-radius: calc(var(--radius) * .8);
      background-color: var(--foreground);
      padding-inline: calc(var(--spacing) * 3);
      padding-block: calc(var(--spacing) * 1.5);
      font-size: var(--text-xs);
      line-height: var(--tw-leading, var(--text-xs--line-height));
      color: var(--background);
      position: absolute;
      top: 50%;
      left: 100%;
    }
  }

  .sidebar-header, .sidebar-footer {
    gap: calc(var(--spacing) * 2);
    padding: calc(var(--spacing) * 2);
    flex-direction: column;
    display: flex;
  }

  .sidebar-content {
    -ms-overflow-style: none;
    scrollbar-width: none;
  }

  .sidebar-content::-webkit-scrollbar {
    display: none;
  }

  .sidebar-content {
    gap: calc(var(--spacing) * 2);
    min-height: 0;
    padding: calc(var(--spacing) * 2);
    flex-direction: column;
    flex: 1;
    display: flex;
    overflow: auto;
  }

  .sidebar-menu {
    gap: var(--spacing);
    flex-direction: column;
    width: 100%;
    min-width: 0;
    display: flex;
  }

  .sidebar-menu-button {
    height: calc(var(--spacing) * 8);
    align-items: center;
    gap: calc(var(--spacing) * 2);
    border-radius: calc(var(--radius) * .8);
    width: 100%;
    padding: calc(var(--spacing) * 2);
    text-align: left;
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    color: var(--sidebar-foreground);
    --tw-ring-color: var(--sidebar-ring);
    --tw-outline-style: none;
    outline-style: none;
    display: flex;
    overflow: hidden;
  }

  @media (forced-colors: active) {
    .sidebar-menu-button {
      outline-offset: 2px;
      outline: 2px solid #0000;
    }
  }

  .sidebar-menu-button {
    transition-property: width, height, padding;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }

  @media (hover: hover) {
    .sidebar-menu-button:hover {
      background-color: var(--sidebar-accent);
      color: var(--sidebar-accent-foreground);
    }
  }

  .sidebar-menu-button:focus-visible {
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  .sidebar-menu-button:active {
    background-color: var(--sidebar-accent);
    color: var(--sidebar-accent-foreground);
  }

  .sidebar-menu-button[aria-current="page"] {
    background-color: var(--sidebar-accent);
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    color: var(--sidebar-accent-foreground);
  }

  .sidebar-menu-button > .icon {
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
  }

  .sidebar-menu-button > span:last-child {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
  }

  .sidebar-menu-button.lg {
    height: calc(var(--spacing) * 12);
  }

  details[open] > .sidebar-menu-button {
    background-color: var(--sidebar-accent);
    color: var(--sidebar-accent-foreground);
  }

  .sidebar-inset {
    background-color: var(--background);
    flex-direction: column;
    flex: 1;
    width: 100%;
    min-width: 0;
    display: flex;
    position: relative;
  }

  .brand-mark {
    aspect-ratio: 1;
    width: calc(var(--spacing) * 8);
    height: calc(var(--spacing) * 8);
    border-radius: var(--radius);
    background-color: var(--sidebar-primary);
    color: var(--sidebar-primary-foreground);
    flex-shrink: 0;
    justify-content: center;
    align-items: center;
    display: flex;
  }

  .avatar {
    width: calc(var(--spacing) * 8);
    height: calc(var(--spacing) * 8);
    border-radius: var(--radius);
    background-color: var(--muted);
    color: var(--muted-foreground);
    --tw-grayscale: grayscale(100%);
    filter: var(--tw-blur, ) var(--tw-brightness, ) var(--tw-contrast, ) var(--tw-grayscale, ) var(--tw-hue-rotate, ) var(--tw-invert, ) var(--tw-saturate, ) var(--tw-sepia, ) var(--tw-drop-shadow, );
    flex-shrink: 0;
    justify-content: center;
    align-items: center;
    display: flex;
    position: relative;
  }

  .site-header {
    min-height: calc(var(--spacing) * 14);
    align-items: center;
    gap: calc(var(--spacing) * 2);
    border-bottom-style: var(--tw-border-style);
    padding-inline: calc(var(--spacing) * 4);
    padding-block: calc(var(--spacing) * 2);
    border-bottom-width: 1px;
    flex-wrap: wrap;
    flex-shrink: 0;
    display: flex;
  }

  @media (min-width: 64rem) {
    .site-header {
      padding-inline: calc(var(--spacing) * 6);
    }
  }

  .main {
    width: 100%;
    max-width: var(--container-7xl);
    gap: calc(var(--spacing) * 6);
    padding: calc(var(--spacing) * 4);
    flex-direction: column;
    flex: 1;
    margin-inline: auto;
    display: flex;
  }

  @media (min-width: 48rem) {
    .main {
      padding: calc(var(--spacing) * 6);
    }
  }

  @media (min-width: 64rem) {
    .main {
      padding: calc(var(--spacing) * 8);
    }
  }

  .breadcrumb-list {
    align-items: center;
    gap: calc(var(--spacing) * 1.5);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    overflow-wrap: break-word;
    color: var(--muted-foreground);
    flex-wrap: wrap;
    display: flex;
  }

  @media (min-width: 40rem) {
    .breadcrumb-list {
      gap: calc(var(--spacing) * 2.5);
    }
  }

  .breadcrumb-item {
    align-items: center;
    gap: calc(var(--spacing) * 1.5);
    display: inline-flex;
  }

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

  @media (hover: hover) {
    .breadcrumb-link:hover {
      color: var(--foreground);
    }
  }

  .breadcrumb-page {
    --tw-font-weight: var(--font-weight-normal);
    font-weight: var(--font-weight-normal);
    color: var(--foreground);
  }

  .breadcrumb-separator > .icon {
    width: calc(var(--spacing) * 3.5);
    height: calc(var(--spacing) * 3.5);
  }

  .dropdown {
    position: relative;
  }

  .dropdown > summary {
    list-style-type: none;
  }

  .dropdown > summary::-webkit-details-marker {
    display: none;
  }

  .dropdown-content {
    z-index: 50;
    margin-top: var(--spacing);
    min-width: calc(var(--spacing) * 56);
    border-radius: calc(var(--radius) * .8);
    background-color: var(--popover);
    padding: var(--spacing);
    color: var(--popover-foreground);
    --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, #0000001a), 0 2px 4px -2px var(--tw-shadow-color, #0000001a);
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    --tw-ring-color: var(--foreground);
    position: absolute;
    overflow: hidden auto;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .dropdown-content {
      --tw-ring-color: color-mix(in oklab, var(--foreground) 10%, transparent);
    }
  }

  .dropdown-content.end, .popover.end {
    right: 0;
  }

  @media not all and (min-width: 48rem) {
    .dropdown-content.side {
      margin-bottom: var(--spacing);
      bottom: 100%;
    }
  }

  @media (min-width: 48rem) {
    .dropdown-content.side {
      margin-top: 0;
      margin-left: calc(var(--spacing) * 2);
      bottom: 0;
      left: 100%;
    }
  }

  .dropdown-label {
    padding-inline: calc(var(--spacing) * 2);
    padding-block: calc(var(--spacing) * 1.5);
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    color: var(--muted-foreground);
  }

  .dropdown-item {
    cursor: pointer;
    align-items: center;
    gap: calc(var(--spacing) * 2);
    border-radius: calc(var(--radius) * .6);
    width: 100%;
    padding-inline: calc(var(--spacing) * 2);
    padding-block: calc(var(--spacing) * 1.5);
    text-align: left;
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-outline-style: none;
    outline-style: none;
    display: flex;
    position: relative;
  }

  @media (forced-colors: active) {
    .dropdown-item {
      outline-offset: 2px;
      outline: 2px solid #0000;
    }
  }

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

  @media (hover: hover) {
    .dropdown-item:hover {
      background-color: var(--accent);
      color: var(--accent-foreground);
    }
  }

  .dropdown-item:focus-visible {
    background-color: var(--accent);
    color: var(--accent-foreground);
  }

  .dropdown-item[aria-current="true"] {
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
  }

  .dropdown-item > .icon {
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
    color: var(--muted-foreground);
  }

  .dropdown-item:not([aria-current="true"]) > .i-check {
    display: none;
  }

  .dropdown-separator {
    margin-inline: calc(var(--spacing) * -1);
    margin-block: var(--spacing);
    background-color: var(--border);
    height: 1px;
  }

  .popover {
    z-index: 50;
    margin-top: var(--spacing);
    width: calc(var(--spacing) * 80);
    border-radius: calc(var(--radius) * .8);
    background-color: var(--popover);
    padding: calc(var(--spacing) * 4);
    color: var(--popover-foreground);
    --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, #0000001a), 0 2px 4px -2px var(--tw-shadow-color, #0000001a);
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    --tw-ring-color: var(--foreground);
    position: absolute;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .popover {
      --tw-ring-color: color-mix(in oklab, var(--foreground) 10%, transparent);
    }
  }

  .btn {
    height: calc(var(--spacing) * 9);
    justify-content: center;
    align-items: center;
    gap: calc(var(--spacing) * 1.5);
    border-radius: calc(var(--radius) * .8);
    border-style: var(--tw-border-style);
    background-color: var(--primary);
    padding-inline: calc(var(--spacing) * 2.5);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    white-space: nowrap;
    color: var(--primary-foreground);
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-outline-style: none;
    -webkit-user-select: none;
    user-select: none;
    background-clip: padding-box;
    border-width: 1px;
    border-color: #0000;
    outline-style: none;
    flex-shrink: 0;
    display: inline-flex;
  }

  @media (hover: hover) {
    .btn:hover {
      background-color: var(--primary);
    }

    @supports (color: color-mix(in lab, red, red)) {
      .btn:hover {
        background-color: color-mix(in oklab, var(--primary) 80%, transparent);
      }
    }
  }

  .btn:focus-visible {
    border-color: var(--ring);
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    --tw-ring-color: var(--ring);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .btn:focus-visible {
      --tw-ring-color: color-mix(in oklab, var(--ring) 50%, transparent);
    }
  }

  .btn:active:not([aria-haspopup]) {
    --tw-translate-y: 1px;
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  .btn:disabled {
    pointer-events: none;
    opacity: .5;
  }

  .btn:has( > .icon:first-child) {
    padding-left: calc(var(--spacing) * 2);
  }

  .btn:has( > .icon:last-child) {
    padding-right: calc(var(--spacing) * 2);
  }

  .btn .icon {
    pointer-events: none;
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
  }

  .btn-outline {
    border-color: var(--border);
    background-color: var(--background);
    color: var(--foreground);
    --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color, #0000000d);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  @media (hover: hover) {
    .btn-outline:hover {
      background-color: var(--muted);
      color: var(--foreground);
    }
  }

  .btn-outline:where(.dark, .dark *) {
    border-color: var(--input);
  }

  @media (prefers-color-scheme: dark) {
    .btn-outline:where(:root:not(.light), :root:not(.light) *) {
      border-color: var(--input);
    }
  }

  .btn-outline:where(.dark, .dark *) {
    background-color: var(--input);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .btn-outline:where(.dark, .dark *) {
      background-color: color-mix(in oklab, var(--input) 30%, transparent);
    }
  }

  @media (prefers-color-scheme: dark) {
    .btn-outline:where(:root:not(.light), :root:not(.light) *) {
      background-color: var(--input);
    }

    @supports (color: color-mix(in lab, red, red)) {
      .btn-outline:where(:root:not(.light), :root:not(.light) *) {
        background-color: color-mix(in oklab, var(--input) 30%, transparent);
      }
    }
  }

  @media (hover: hover) {
    .btn-outline:where(.dark, .dark *):hover {
      background-color: var(--input);
    }

    @supports (color: color-mix(in lab, red, red)) {
      .btn-outline:where(.dark, .dark *):hover {
        background-color: color-mix(in oklab, var(--input) 50%, transparent);
      }
    }
  }

  @media (prefers-color-scheme: dark) {
    @media (hover: hover) {
      .btn-outline:where(:root:not(.light), :root:not(.light) *):hover {
        background-color: var(--input);
      }

      @supports (color: color-mix(in lab, red, red)) {
        .btn-outline:where(:root:not(.light), :root:not(.light) *):hover {
          background-color: color-mix(in oklab, var(--input) 50%, transparent);
        }
      }
    }
  }

  .btn-secondary {
    background-color: var(--secondary);
    color: var(--secondary-foreground);
  }

  @media (hover: hover) {
    .btn-secondary:hover {
      background-color: var(--secondary);
    }

    @supports (color: color-mix(in lab, red, red)) {
      .btn-secondary:hover {
        background-color: color-mix(in oklch,var(--secondary),var(--foreground) 5%);
      }
    }
  }

  .btn-ghost {
    color: var(--foreground);
    background-color: #0000;
  }

  @media (hover: hover) {
    .btn-ghost:hover {
      background-color: var(--muted);
      color: var(--foreground);
    }

    .btn-ghost:where(.dark, .dark *):hover {
      background-color: var(--muted);
    }

    @supports (color: color-mix(in lab, red, red)) {
      .btn-ghost:where(.dark, .dark *):hover {
        background-color: color-mix(in oklab, var(--muted) 50%, transparent);
      }
    }
  }

  @media (prefers-color-scheme: dark) {
    @media (hover: hover) {
      .btn-ghost:where(:root:not(.light), :root:not(.light) *):hover {
        background-color: var(--muted);
      }

      @supports (color: color-mix(in lab, red, red)) {
        .btn-ghost:where(:root:not(.light), :root:not(.light) *):hover {
          background-color: color-mix(in oklab, var(--muted) 50%, transparent);
        }
      }
    }
  }

  .btn-destructive {
    background-color: var(--destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .btn-destructive {
      background-color: color-mix(in oklab, var(--destructive) 10%, transparent);
    }
  }

  .btn-destructive {
    color: var(--destructive);
  }

  @media (hover: hover) {
    .btn-destructive:hover {
      background-color: var(--destructive);
    }

    @supports (color: color-mix(in lab, red, red)) {
      .btn-destructive:hover {
        background-color: color-mix(in oklab, var(--destructive) 20%, transparent);
      }
    }
  }

  .btn-destructive:focus-visible {
    border-color: var(--destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .btn-destructive:focus-visible {
      border-color: color-mix(in oklab, var(--destructive) 40%, transparent);
    }
  }

  .btn-destructive:focus-visible {
    --tw-ring-color: var(--destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .btn-destructive:focus-visible {
      --tw-ring-color: color-mix(in oklab, var(--destructive) 20%, transparent);
    }
  }

  .btn-destructive:where(.dark, .dark *) {
    background-color: var(--destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .btn-destructive:where(.dark, .dark *) {
      background-color: color-mix(in oklab, var(--destructive) 20%, transparent);
    }
  }

  @media (prefers-color-scheme: dark) {
    .btn-destructive:where(:root:not(.light), :root:not(.light) *) {
      background-color: var(--destructive);
    }

    @supports (color: color-mix(in lab, red, red)) {
      .btn-destructive:where(:root:not(.light), :root:not(.light) *) {
        background-color: color-mix(in oklab, var(--destructive) 20%, transparent);
      }
    }
  }

  @media (hover: hover) {
    .btn-destructive:where(.dark, .dark *):hover {
      background-color: var(--destructive);
    }

    @supports (color: color-mix(in lab, red, red)) {
      .btn-destructive:where(.dark, .dark *):hover {
        background-color: color-mix(in oklab, var(--destructive) 30%, transparent);
      }
    }
  }

  @media (prefers-color-scheme: dark) {
    @media (hover: hover) {
      .btn-destructive:where(:root:not(.light), :root:not(.light) *):hover {
        background-color: var(--destructive);
      }

      @supports (color: color-mix(in lab, red, red)) {
        .btn-destructive:where(:root:not(.light), :root:not(.light) *):hover {
          background-color: color-mix(in oklab, var(--destructive) 30%, transparent);
        }
      }
    }
  }

  .btn-destructive:where(.dark, .dark *):focus-visible {
    --tw-ring-color: var(--destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .btn-destructive:where(.dark, .dark *):focus-visible {
      --tw-ring-color: color-mix(in oklab, var(--destructive) 40%, transparent);
    }
  }

  @media (prefers-color-scheme: dark) {
    .btn-destructive:where(:root:not(.light), :root:not(.light) *):focus-visible {
      --tw-ring-color: var(--destructive);
    }

    @supports (color: color-mix(in lab, red, red)) {
      .btn-destructive:where(:root:not(.light), :root:not(.light) *):focus-visible {
        --tw-ring-color: color-mix(in oklab, var(--destructive) 40%, transparent);
      }
    }
  }

  .btn-sm {
    height: calc(var(--spacing) * 8);
    gap: var(--spacing);
    border-radius: min(var(--radius-md), 10px);
    padding-inline: calc(var(--spacing) * 2.5);
  }

  .btn-sm:has( > .icon:first-child) {
    padding-left: calc(var(--spacing) * 1.5);
  }

  .btn-sm:has( > .icon:last-child) {
    padding-right: calc(var(--spacing) * 1.5);
  }

  .btn-icon {
    width: calc(var(--spacing) * 9);
    height: calc(var(--spacing) * 9);
    padding-inline: 0;
  }

  .btn-icon:has( > .icon:first-child) {
    padding-left: 0;
  }

  .btn-icon:has( > .icon:last-child) {
    padding-right: 0;
  }

  .btn-icon-sm {
    width: calc(var(--spacing) * 8);
    height: calc(var(--spacing) * 8);
    border-radius: min(var(--radius-md), 10px);
    padding-inline: 0;
  }

  .btn-icon-sm:has( > .icon:first-child) {
    padding-left: 0;
  }

  .btn-icon-sm:has( > .icon:last-child) {
    padding-right: 0;
  }

  .mode-toggle .i-sun {
    --tw-scale-x: 100%;
    --tw-scale-y: 100%;
    --tw-scale-z: 100%;
    width: 1.2rem;
    height: 1.2rem;
    scale: var(--tw-scale-x) var(--tw-scale-y);
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    rotate: 0deg;
  }

  .mode-toggle .i-sun:where(.dark, .dark *) {
    --tw-scale-x: 0%;
    --tw-scale-y: 0%;
    --tw-scale-z: 0%;
    scale: var(--tw-scale-x) var(--tw-scale-y);
  }

  @media (prefers-color-scheme: dark) {
    .mode-toggle .i-sun:where(:root:not(.light), :root:not(.light) *) {
      --tw-scale-x: 0%;
      --tw-scale-y: 0%;
      --tw-scale-z: 0%;
      scale: var(--tw-scale-x) var(--tw-scale-y);
    }
  }

  .mode-toggle .i-sun:where(.dark, .dark *) {
    rotate: -90deg;
  }

  @media (prefers-color-scheme: dark) {
    .mode-toggle .i-sun:where(:root:not(.light), :root:not(.light) *) {
      rotate: -90deg;
    }
  }

  .mode-toggle .i-moon {
    --tw-scale-x: 0%;
    --tw-scale-y: 0%;
    --tw-scale-z: 0%;
    width: 1.2rem;
    height: 1.2rem;
    scale: var(--tw-scale-x) var(--tw-scale-y);
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    position: absolute;
    rotate: 90deg;
  }

  .mode-toggle .i-moon:where(.dark, .dark *) {
    --tw-scale-x: 100%;
    --tw-scale-y: 100%;
    --tw-scale-z: 100%;
    scale: var(--tw-scale-x) var(--tw-scale-y);
  }

  @media (prefers-color-scheme: dark) {
    .mode-toggle .i-moon:where(:root:not(.light), :root:not(.light) *) {
      --tw-scale-x: 100%;
      --tw-scale-y: 100%;
      --tw-scale-z: 100%;
      scale: var(--tw-scale-x) var(--tw-scale-y);
    }
  }

  .mode-toggle .i-moon:where(.dark, .dark *) {
    rotate: 0deg;
  }

  @media (prefers-color-scheme: dark) {
    .mode-toggle .i-moon:where(:root:not(.light), :root:not(.light) *) {
      rotate: 0deg;
    }
  }

  .badge {
    height: calc(var(--spacing) * 5);
    justify-content: center;
    align-items: center;
    gap: var(--spacing);
    border-radius: calc(var(--radius) * 2.6);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-slate-300);
    background-color: var(--color-slate-100);
    width: fit-content;
    padding-block: calc(var(--spacing) * .5);
    padding-right: calc(var(--spacing) * 2);
    padding-left: calc(var(--spacing) * 1.5);
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    white-space: nowrap;
    color: var(--color-slate-800);
    flex-shrink: 0;
    display: inline-flex;
    overflow: hidden;
  }

  .badge:where(.dark, .dark *) {
    border-color: var(--color-slate-700);
  }

  @media (prefers-color-scheme: dark) {
    .badge:where(:root:not(.light), :root:not(.light) *) {
      border-color: var(--color-slate-700);
    }
  }

  .badge:where(.dark, .dark *) {
    background-color: var(--color-slate-800);
  }

  @media (prefers-color-scheme: dark) {
    .badge:where(:root:not(.light), :root:not(.light) *) {
      background-color: var(--color-slate-800);
    }
  }

  .badge:where(.dark, .dark *) {
    color: var(--color-slate-200);
  }

  @media (prefers-color-scheme: dark) {
    .badge:where(:root:not(.light), :root:not(.light) *) {
      color: var(--color-slate-200);
    }
  }

  .badge:before {
    content: "";
    width: calc(var(--spacing) * 3);
    height: calc(var(--spacing) * 3);
    -webkit-mask: var(--icon) center / contain no-repeat;
    -webkit-mask: var(--icon) center / contain no-repeat;
    mask: var(--icon) center / contain no-repeat;
    --icon: url("/static/icons/circle-dashed.svg");
    background-color: currentColor;
    flex-shrink: 0;
  }

  .badge.ok {
    border-color: var(--color-green-300);
    background-color: var(--color-green-200);
    color: var(--color-green-900);
  }

  .badge.ok:where(.dark, .dark *) {
    border-color: var(--color-green-800);
  }

  @media (prefers-color-scheme: dark) {
    .badge.ok:where(:root:not(.light), :root:not(.light) *) {
      border-color: var(--color-green-800);
    }
  }

  .badge.ok:where(.dark, .dark *) {
    background-color: var(--color-green-950);
  }

  @media (prefers-color-scheme: dark) {
    .badge.ok:where(:root:not(.light), :root:not(.light) *) {
      background-color: var(--color-green-950);
    }
  }

  .badge.ok:where(.dark, .dark *) {
    color: var(--color-green-200);
  }

  @media (prefers-color-scheme: dark) {
    .badge.ok:where(:root:not(.light), :root:not(.light) *) {
      color: var(--color-green-200);
    }
  }

  .badge.ok:before {
    --icon: url("/static/icons/circle-check-big.svg");
  }

  .badge.busy {
    border-color: var(--color-blue-300);
    background-color: var(--color-blue-100);
    color: var(--color-blue-800);
  }

  .badge.busy:where(.dark, .dark *) {
    border-color: var(--color-blue-800);
  }

  @media (prefers-color-scheme: dark) {
    .badge.busy:where(:root:not(.light), :root:not(.light) *) {
      border-color: var(--color-blue-800);
    }
  }

  .badge.busy:where(.dark, .dark *) {
    background-color: var(--color-blue-950);
  }

  @media (prefers-color-scheme: dark) {
    .badge.busy:where(:root:not(.light), :root:not(.light) *) {
      background-color: var(--color-blue-950);
    }
  }

  .badge.busy:where(.dark, .dark *) {
    color: var(--color-blue-200);
  }

  @media (prefers-color-scheme: dark) {
    .badge.busy:where(:root:not(.light), :root:not(.light) *) {
      color: var(--color-blue-200);
    }
  }

  @media (prefers-reduced-motion: no-preference) {
    .badge.busy:before {
      animation: var(--animate-spin);
    }
  }

  .badge.busy:before {
    --icon: url("/static/icons/loader-circle.svg");
  }

  .badge.warn {
    border-color: var(--color-amber-300);
    background-color: var(--color-amber-200);
    color: var(--color-amber-950);
  }

  .badge.warn:where(.dark, .dark *) {
    border-color: var(--color-amber-800);
  }

  @media (prefers-color-scheme: dark) {
    .badge.warn:where(:root:not(.light), :root:not(.light) *) {
      border-color: var(--color-amber-800);
    }
  }

  .badge.warn:where(.dark, .dark *) {
    background-color: var(--color-amber-950);
  }

  @media (prefers-color-scheme: dark) {
    .badge.warn:where(:root:not(.light), :root:not(.light) *) {
      background-color: var(--color-amber-950);
    }
  }

  .badge.warn:where(.dark, .dark *) {
    color: var(--color-amber-200);
  }

  @media (prefers-color-scheme: dark) {
    .badge.warn:where(:root:not(.light), :root:not(.light) *) {
      color: var(--color-amber-200);
    }
  }

  .badge.warn:before {
    --icon: url("/static/icons/triangle-alert.svg");
  }

  .badge.bad {
    border-color: var(--color-red-300);
    background-color: var(--color-red-100);
    color: var(--color-red-800);
  }

  .badge.bad:where(.dark, .dark *) {
    border-color: var(--color-red-800);
  }

  @media (prefers-color-scheme: dark) {
    .badge.bad:where(:root:not(.light), :root:not(.light) *) {
      border-color: var(--color-red-800);
    }
  }

  .badge.bad:where(.dark, .dark *) {
    background-color: var(--color-red-950);
  }

  @media (prefers-color-scheme: dark) {
    .badge.bad:where(:root:not(.light), :root:not(.light) *) {
      background-color: var(--color-red-950);
    }
  }

  .badge.bad:where(.dark, .dark *) {
    color: var(--color-red-200);
  }

  @media (prefers-color-scheme: dark) {
    .badge.bad:where(:root:not(.light), :root:not(.light) *) {
      color: var(--color-red-200);
    }
  }

  .badge.bad:before {
    --icon: url("/static/icons/circle-x.svg");
  }

  .tag {
    height: calc(var(--spacing) * 5);
    justify-content: center;
    align-items: center;
    gap: var(--spacing);
    border-radius: calc(var(--radius) * 2.6);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--border);
    width: fit-content;
    padding-inline: calc(var(--spacing) * 2);
    padding-block: calc(var(--spacing) * .5);
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    white-space: nowrap;
    color: var(--foreground);
    flex-shrink: 0;
    display: inline-flex;
    overflow: hidden;
  }

  .tag.warn {
    border-color: var(--color-amber-300);
    background-color: var(--color-amber-200);
    color: var(--color-amber-950);
  }

  .tag.warn:where(.dark, .dark *) {
    border-color: var(--color-amber-800);
  }

  @media (prefers-color-scheme: dark) {
    .tag.warn:where(:root:not(.light), :root:not(.light) *) {
      border-color: var(--color-amber-800);
    }
  }

  .tag.warn:where(.dark, .dark *) {
    background-color: var(--color-amber-950);
  }

  @media (prefers-color-scheme: dark) {
    .tag.warn:where(:root:not(.light), :root:not(.light) *) {
      background-color: var(--color-amber-950);
    }
  }

  .tag.warn:where(.dark, .dark *) {
    color: var(--color-amber-200);
  }

  @media (prefers-color-scheme: dark) {
    .tag.warn:where(:root:not(.light), :root:not(.light) *) {
      color: var(--color-amber-200);
    }
  }

  .dot {
    width: calc(var(--spacing) * 2.5);
    height: calc(var(--spacing) * 2.5);
    background-color: var(--color-slate-400);
    border-radius: 3.40282e38px;
    flex-shrink: 0;
    display: inline-block;
  }

  .dot.ok {
    background-color: var(--color-green-500);
  }

  .dot.busy {
    background-color: var(--color-blue-500);
  }

  @media (prefers-reduced-motion: no-preference) {
    .dot.busy {
      animation: var(--animate-pulse);
    }
  }

  .dot.warn {
    background-image: linear-gradient(90deg,var(--color-amber-500) 50%,transparent 50%);
    --tw-shadow: inset 0 0 0 1.5px var(--tw-shadow-color, var(--color-amber-500));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  .dot.bad {
    --tw-shadow: inset 0 0 0 2.5px var(--tw-shadow-color, var(--color-red-500));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    background-color: #0000;
  }

  .health {
    align-items: center;
    gap: calc(var(--spacing) * 2);
    color: var(--color-slate-500);
    display: inline-flex;
  }

  .health:before {
    content: var(--tw-content);
    width: calc(var(--spacing) * 3);
    height: calc(var(--spacing) * 3);
    content: var(--tw-content);
    content: var(--tw-content);
    content: var(--tw-content);
    content: var(--tw-content);
    --tw-content: "";
    content: var(--tw-content);
    background-color: currentColor;
    border-radius: 3.40282e38px;
    flex-shrink: 0;
  }

  .health:where(.dark, .dark *) {
    color: var(--color-slate-400);
  }

  @media (prefers-color-scheme: dark) {
    .health:where(:root:not(.light), :root:not(.light) *) {
      color: var(--color-slate-400);
    }
  }

  .health.ok {
    color: var(--color-green-700);
  }

  .health.ok:where(.dark, .dark *) {
    color: var(--color-green-400);
  }

  @media (prefers-color-scheme: dark) {
    .health.ok:where(:root:not(.light), :root:not(.light) *) {
      color: var(--color-green-400);
    }
  }

  .health.busy {
    color: var(--color-blue-700);
  }

  .health.busy:where(.dark, .dark *) {
    color: var(--color-blue-400);
  }

  @media (prefers-color-scheme: dark) {
    .health.busy:where(:root:not(.light), :root:not(.light) *) {
      color: var(--color-blue-400);
    }
  }

  .health.warn {
    color: var(--color-amber-700);
  }

  .health.warn:where(.dark, .dark *) {
    color: var(--color-amber-400);
  }

  @media (prefers-color-scheme: dark) {
    .health.warn:where(:root:not(.light), :root:not(.light) *) {
      color: var(--color-amber-400);
    }
  }

  .health.bad {
    color: var(--color-red-700);
  }

  .health.bad:where(.dark, .dark *) {
    color: var(--color-red-400);
  }

  @media (prefers-color-scheme: dark) {
    .health.bad:where(:root:not(.light), :root:not(.light) *) {
      color: var(--color-red-400);
    }
  }

  .alert {
    column-gap: calc(var(--spacing) * 2.5);
    row-gap: calc(var(--spacing) * .5);
    border-radius: var(--radius);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-blue-300);
    background-color: var(--color-blue-100);
    width: 100%;
    padding-inline: calc(var(--spacing) * 4);
    padding-block: calc(var(--spacing) * 3);
    text-align: left;
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    color: var(--color-blue-950);
    grid-template-columns: auto 1fr;
    display: grid;
    position: relative;
  }

  :is(.alert > *) {
    grid-column-start: 2;
  }

  .alert:where(.dark, .dark *) {
    border-color: var(--color-blue-800);
  }

  @media (prefers-color-scheme: dark) {
    .alert:where(:root:not(.light), :root:not(.light) *) {
      border-color: var(--color-blue-800);
    }
  }

  .alert:where(.dark, .dark *) {
    background-color: var(--color-blue-950);
  }

  @media (prefers-color-scheme: dark) {
    .alert:where(:root:not(.light), :root:not(.light) *) {
      background-color: var(--color-blue-950);
    }
  }

  .alert:where(.dark, .dark *) {
    color: var(--color-blue-100);
  }

  @media (prefers-color-scheme: dark) {
    .alert:where(:root:not(.light), :root:not(.light) *) {
      color: var(--color-blue-100);
    }
  }

  .alert a {
    text-underline-offset: 3px;
    text-decoration-line: underline;
  }

  .alert:before {
    content: "";
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
    --tw-translate-y: calc(var(--spacing) * .5);
    translate: var(--tw-translate-x) var(--tw-translate-y);
    background-color: var(--color-blue-700);
    grid-row: span 2 / span 2;
  }

  .alert:before:where() {
    background-color: var(--color-blue-400);
  }

  @media (prefers-color-scheme: dark) {
    .alert:before:where() {
      background-color: var(--color-blue-400);
    }
  }

  .alert:before {
    -webkit-mask: var(--icon) center / contain no-repeat;
    -webkit-mask: var(--icon) center / contain no-repeat;
    mask: var(--icon) center / contain no-repeat;
    --icon: url("/static/icons/info.svg");
  }

  .alert.warn {
    border-color: var(--color-amber-300);
    background-color: var(--color-amber-100);
    color: var(--color-amber-950);
  }

  .alert.warn:before {
    content: var(--tw-content);
    background-color: var(--color-amber-700);
  }

  .alert.warn:where(.dark, .dark *) {
    border-color: var(--color-amber-800);
  }

  @media (prefers-color-scheme: dark) {
    .alert.warn:where(:root:not(.light), :root:not(.light) *) {
      border-color: var(--color-amber-800);
    }
  }

  .alert.warn:where(.dark, .dark *) {
    background-color: var(--color-amber-950);
  }

  @media (prefers-color-scheme: dark) {
    .alert.warn:where(:root:not(.light), :root:not(.light) *) {
      background-color: var(--color-amber-950);
    }
  }

  .alert.warn:where(.dark, .dark *) {
    color: var(--color-amber-100);
  }

  @media (prefers-color-scheme: dark) {
    .alert.warn:where(:root:not(.light), :root:not(.light) *) {
      color: var(--color-amber-100);
    }
  }

  .alert.warn:where(.dark, .dark *):before {
    content: var(--tw-content);
    background-color: var(--color-amber-400);
  }

  @media (prefers-color-scheme: dark) {
    .alert.warn:where(:root:not(.light), :root:not(.light) *):before {
      content: var(--tw-content);
      background-color: var(--color-amber-400);
    }
  }

  .alert.warn:before {
    --icon: url("/static/icons/triangle-alert.svg");
  }

  .alert.bad {
    border-color: var(--color-red-300);
    background-color: var(--color-red-100);
    color: var(--color-red-950);
  }

  .alert.bad:before {
    content: var(--tw-content);
    background-color: var(--color-red-700);
  }

  .alert.bad:where(.dark, .dark *) {
    border-color: var(--color-red-800);
  }

  @media (prefers-color-scheme: dark) {
    .alert.bad:where(:root:not(.light), :root:not(.light) *) {
      border-color: var(--color-red-800);
    }
  }

  .alert.bad:where(.dark, .dark *) {
    background-color: var(--color-red-950);
  }

  @media (prefers-color-scheme: dark) {
    .alert.bad:where(:root:not(.light), :root:not(.light) *) {
      background-color: var(--color-red-950);
    }
  }

  .alert.bad:where(.dark, .dark *) {
    color: var(--color-red-100);
  }

  @media (prefers-color-scheme: dark) {
    .alert.bad:where(:root:not(.light), :root:not(.light) *) {
      color: var(--color-red-100);
    }
  }

  .alert.bad:where(.dark, .dark *):before {
    content: var(--tw-content);
    background-color: var(--color-red-400);
  }

  @media (prefers-color-scheme: dark) {
    .alert.bad:where(:root:not(.light), :root:not(.light) *):before {
      content: var(--tw-content);
      background-color: var(--color-red-400);
    }
  }

  .alert.bad:before {
    --icon: url("/static/icons/circle-alert.svg");
  }

  .card {
    gap: calc(var(--spacing) * 6);
    border-radius: calc(var(--radius) * 1.4);
    background-color: var(--card);
    padding-block: calc(var(--spacing) * 6);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    color: var(--card-foreground);
    --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color, #0000000d);
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    --tw-ring-color: var(--foreground);
    flex-direction: column;
    display: flex;
    overflow: hidden;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .card {
      --tw-ring-color: color-mix(in oklab, var(--foreground) 10%, transparent);
    }
  }

  .card-header {
    align-items: flex-start;
    gap: var(--spacing);
    padding-inline: calc(var(--spacing) * 6);
    grid-auto-rows: min-content;
    display: grid;
  }

  .card-header:has( > .card-action) {
    grid-template-columns: 1fr auto;
  }

  .card-header:has( > .card-description) {
    grid-template-rows: auto auto;
  }

  .card-title {
    align-items: center;
    gap: calc(var(--spacing) * 2);
    font-size: var(--text-base);
    line-height: var(--tw-leading, var(--text-base--line-height));
    --tw-leading: var(--leading-normal);
    line-height: var(--leading-normal);
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    flex-wrap: wrap;
    display: flex;
  }

  .card-description {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    color: var(--muted-foreground);
  }

  .card-description a {
    text-decoration-line: underline;
  }

  .card-action {
    align-items: center;
    gap: calc(var(--spacing) * 2);
    flex-wrap: wrap;
    grid-row: 1 / span 2;
    grid-column-start: 2;
    place-self: flex-start flex-end;
    display: flex;
  }

  .card-content {
    gap: calc(var(--spacing) * 3);
    padding-inline: calc(var(--spacing) * 6);
    flex-direction: column;
    display: flex;
  }

  .card-footer {
    align-items: center;
    gap: calc(var(--spacing) * 2);
    padding-inline: calc(var(--spacing) * 6);
    flex-wrap: wrap;
    display: flex;
  }

  .cards {
    gap: calc(var(--spacing) * 4);
    grid-template-columns: repeat(auto-fit, minmax(18rem, 1fr));
    display: grid;
  }

  .tiles {
    gap: calc(var(--spacing) * 4);
    grid-template-columns: repeat(auto-fit, minmax(10.5rem, 1fr));
    display: grid;
  }

  .tile {
    gap: var(--spacing);
    border-radius: calc(var(--radius) * 1.4);
    background-color: var(--card);
    --tw-gradient-position: to top;
    flex-direction: column;
    min-width: 0;
    display: flex;
  }

  @supports (background-image: linear-gradient(in lab, red, red)) {
    .tile {
      --tw-gradient-position: to top in oklab;
    }
  }

  .tile {
    background-image: linear-gradient(var(--tw-gradient-stops));
    --tw-gradient-from: var(--primary);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .tile {
      --tw-gradient-from: color-mix(in oklab, var(--primary) 5%, transparent);
    }
  }

  .tile {
    --tw-gradient-to: var(--card);
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
    padding-inline: calc(var(--spacing) * 5);
    padding-block: calc(var(--spacing) * 4);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    color: var(--card-foreground);
    --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color, #0000000d);
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    --tw-ring-color: var(--foreground);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .tile {
      --tw-ring-color: color-mix(in oklab, var(--foreground) 10%, transparent);
    }
  }

  .tile:where(.dark, .dark *) {
    background-image: none;
  }

  @media (prefers-color-scheme: dark) {
    .tile:where(:root:not(.light), :root:not(.light) *) {
      background-image: none;
    }
  }

  .tile dt {
    color: var(--muted-foreground);
  }

  .tile .value {
    font-size: var(--text-2xl);
    line-height: var(--tw-leading, var(--text-2xl--line-height));
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
    --tw-numeric-spacing: tabular-nums;
    font-variant-numeric: var(--tw-ordinal, ) var(--tw-slashed-zero, ) var(--tw-numeric-figure, ) var(--tw-numeric-spacing, ) var(--tw-numeric-fraction, );
  }

  .tile .value .health {
    font-size: var(--text-lg);
    line-height: var(--tw-leading, var(--text-lg--line-height));
    overflow-wrap: anywhere;
  }

  .tile .sub {
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    color: var(--muted-foreground);
  }

  .tile .sub a {
    text-decoration-line: underline;
  }

  .tile .value .of {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-normal);
    font-weight: var(--font-weight-normal);
    color: var(--muted-foreground);
  }

  .tile .meter {
    margin-block: var(--spacing);
    align-items: center;
    gap: calc(var(--spacing) * 3);
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    color: var(--muted-foreground);
    --tw-numeric-spacing: tabular-nums;
    font-variant-numeric: var(--tw-ordinal, ) var(--tw-slashed-zero, ) var(--tw-numeric-figure, ) var(--tw-numeric-spacing, ) var(--tw-numeric-fraction, );
    display: flex;
  }

  meter {
    height: calc(var(--spacing) * 1.5);
    border-style: var(--tw-border-style);
    background-color: var(--foreground);
    border-width: 0;
    border-radius: 3.40282e38px;
    flex: 1;
    width: 100%;
    min-width: 0;
    display: block;
    overflow: hidden;
  }

  @supports (color: color-mix(in lab, red, red)) {
    meter {
      background-color: color-mix(in oklab, var(--foreground) 10%, transparent);
    }
  }

  meter {
    background-image: none;
  }

  meter::-webkit-meter-bar {
    border-style: var(--tw-border-style);
    background-color: #0000;
    background-image: none;
    border-width: 0;
    border-radius: 3.40282e38px;
    height: 100%;
  }

  meter::-webkit-meter-optimum-value {
    background-color: var(--primary);
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    background-image: none;
  }

  meter::-moz-meter-bar {
    background-color: var(--primary);
    background-image: none;
  }

  .table-container {
    width: 100%;
    position: relative;
    overflow-x: auto;
  }

  .table-frame {
    border-radius: var(--radius);
    border-style: var(--tw-border-style);
    border-width: 1px;
    width: 100%;
    position: relative;
    overflow-x: auto;
  }

  .table-frame thead {
    background-color: var(--muted);
  }

  .table-frame tr > :first-child {
    padding-left: calc(var(--spacing) * 4);
  }

  .table-frame tr > :last-child {
    padding-right: calc(var(--spacing) * 4);
  }

  .table {
    caption-side: bottom;
    width: 100%;
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
  }

  .table thead tr, .table tr {
    border-bottom-style: var(--tw-border-style);
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    border-bottom-width: 1px;
  }

  @media (hover: hover) {
    :is(.table thead tr, .table tr):hover {
      background-color: var(--muted);
    }

    @supports (color: color-mix(in lab, red, red)) {
      :is(.table thead tr, .table tr):hover {
        background-color: color-mix(in oklab, var(--muted) 50%, transparent);
      }
    }
  }

  .table tbody tr:last-child, .table > tr:last-child {
    border-style: var(--tw-border-style);
    border-width: 0;
  }

  .table th {
    height: calc(var(--spacing) * 10);
    padding-inline: calc(var(--spacing) * 2);
    text-align: left;
    vertical-align: middle;
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    white-space: nowrap;
    color: var(--foreground);
  }

  .table td {
    padding: calc(var(--spacing) * 2);
    vertical-align: middle;
    white-space: nowrap;
  }

  .table tbody th {
    height: auto;
    padding: calc(var(--spacing) * 2);
  }

  .table .num {
    text-align: right;
    --tw-numeric-spacing: tabular-nums;
    font-variant-numeric: var(--tw-ordinal, ) var(--tw-slashed-zero, ) var(--tw-numeric-figure, ) var(--tw-numeric-spacing, ) var(--tw-numeric-fraction, );
  }

  .table .truncate {
    max-width: calc(var(--spacing) * 80);
  }

  .tabs {
    align-items: center;
    gap: var(--spacing);
    border-bottom-style: var(--tw-border-style);
    width: 100%;
    color: var(--muted-foreground);
    border-bottom-width: 1px;
    flex-wrap: wrap;
    display: flex;
  }

  .tabs a {
    height: calc(var(--spacing) * 9);
    justify-content: center;
    align-items: center;
    gap: calc(var(--spacing) * 1.5);
    border-radius: calc(var(--radius) * .8);
    border-style: var(--tw-border-style);
    padding-inline: calc(var(--spacing) * 2);
    padding-block: var(--spacing);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    white-space: nowrap;
    color: var(--foreground);
    border-width: 1px;
    border-color: #0000;
    display: inline-flex;
    position: relative;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .tabs a {
      color: color-mix(in oklab, var(--foreground) 60%, transparent);
    }
  }

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

  .tabs a:after {
    content: var(--tw-content);
    content: var(--tw-content);
    content: var(--tw-content);
    content: var(--tw-content);
    height: calc(var(--spacing) * .5);
    content: var(--tw-content);
    background-color: var(--foreground);
    content: var(--tw-content);
    opacity: 0;
    content: var(--tw-content);
    transition-property: opacity;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    inset-inline: 0;
    position: absolute;
    bottom: -1px;
  }

  @media (hover: hover) {
    .tabs a:hover {
      color: var(--foreground);
    }
  }

  .tabs a:focus-visible {
    border-color: var(--ring);
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    --tw-ring-color: var(--ring);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .tabs a:focus-visible {
      --tw-ring-color: color-mix(in oklab, var(--ring) 50%, transparent);
    }
  }

  .tabs a[aria-current="page"] {
    color: var(--foreground);
  }

  .tabs a[aria-current="page"]:after {
    content: var(--tw-content);
    opacity: 1;
  }

  .tabs a:where(.dark, .dark *) {
    color: var(--muted-foreground);
  }

  @media (prefers-color-scheme: dark) {
    .tabs a:where(:root:not(.light), :root:not(.light) *) {
      color: var(--muted-foreground);
    }
  }

  @media (hover: hover) {
    .tabs a:where(.dark, .dark *):hover {
      color: var(--foreground);
    }
  }

  @media (prefers-color-scheme: dark) {
    @media (hover: hover) {
      .tabs a:where(:root:not(.light), :root:not(.light) *):hover {
        color: var(--foreground);
      }
    }
  }

  .tabs a:where(.dark, .dark *)[aria-current="page"] {
    color: var(--foreground);
  }

  @media (prefers-color-scheme: dark) {
    .tabs a:where(:root:not(.light), :root:not(.light) *)[aria-current="page"] {
      color: var(--foreground);
    }
  }

  .pills {
    align-items: center;
    gap: calc(var(--spacing) * .5);
    border-radius: var(--radius);
    background-color: var(--muted);
    width: fit-content;
    color: var(--muted-foreground);
    flex-wrap: wrap;
    padding: 3px;
    display: inline-flex;
  }

  .pills > a {
    min-height: calc(var(--spacing) * 8);
    justify-content: center;
    align-items: center;
    gap: calc(var(--spacing) * 1.5);
    border-radius: calc(var(--radius) * .8);
    border-style: var(--tw-border-style);
    padding-inline: calc(var(--spacing) * 2.5);
    padding-block: var(--spacing);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    white-space: nowrap;
    color: var(--foreground);
    border-width: 1px;
    border-color: #0000;
    display: inline-flex;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .pills > a {
      color: color-mix(in oklab, var(--foreground) 60%, transparent);
    }
  }

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

  @media (hover: hover) {
    .pills > a:hover {
      color: var(--foreground);
    }
  }

  .pills > a:focus-visible {
    border-color: var(--ring);
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    --tw-ring-color: var(--ring);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .pills > a:focus-visible {
      --tw-ring-color: color-mix(in oklab, var(--ring) 50%, transparent);
    }
  }

  .pills > a[aria-current="page"] {
    background-color: var(--background);
    color: var(--foreground);
    --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, #0000001a), 0 1px 2px -1px var(--tw-shadow-color, #0000001a);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  .pills > a:where(.dark, .dark *) {
    color: var(--muted-foreground);
  }

  @media (prefers-color-scheme: dark) {
    .pills > a:where(:root:not(.light), :root:not(.light) *) {
      color: var(--muted-foreground);
    }
  }

  @media (hover: hover) {
    .pills > a:where(.dark, .dark *):hover {
      color: var(--foreground);
    }
  }

  @media (prefers-color-scheme: dark) {
    @media (hover: hover) {
      .pills > a:where(:root:not(.light), :root:not(.light) *):hover {
        color: var(--foreground);
      }
    }
  }

  .pills > a:where(.dark, .dark *)[aria-current="page"] {
    border-color: var(--input);
  }

  @media (prefers-color-scheme: dark) {
    .pills > a:where(:root:not(.light), :root:not(.light) *)[aria-current="page"] {
      border-color: var(--input);
    }
  }

  .pills > a:where(.dark, .dark *)[aria-current="page"] {
    background-color: var(--input);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .pills > a:where(.dark, .dark *)[aria-current="page"] {
      background-color: color-mix(in oklab, var(--input) 30%, transparent);
    }
  }

  @media (prefers-color-scheme: dark) {
    .pills > a:where(:root:not(.light), :root:not(.light) *)[aria-current="page"] {
      background-color: var(--input);
    }

    @supports (color: color-mix(in lab, red, red)) {
      .pills > a:where(:root:not(.light), :root:not(.light) *)[aria-current="page"] {
        background-color: color-mix(in oklab, var(--input) 30%, transparent);
      }
    }
  }

  .pills > a:where(.dark, .dark *)[aria-current="page"] {
    color: var(--foreground);
  }

  @media (prefers-color-scheme: dark) {
    .pills > a:where(:root:not(.light), :root:not(.light) *)[aria-current="page"] {
      color: var(--foreground);
    }
  }

  .pills > .tag {
    margin-inline: var(--spacing);
  }

  .field {
    gap: calc(var(--spacing) * 2);
    flex-direction: column;
    width: 100%;
    min-width: 0;
    display: flex;
  }

  .hint {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-leading: var(--leading-normal);
    line-height: var(--leading-normal);
    --tw-font-weight: var(--font-weight-normal);
    font-weight: var(--font-weight-normal);
    color: var(--muted-foreground);
  }

  .hint a {
    text-decoration-line: underline;
  }

  .row {
    column-gap: calc(var(--spacing) * 4);
    row-gap: calc(var(--spacing) * 6);
    grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
    display: grid;
  }

  .select {
    width: 100%;
    position: relative;
  }

  .select:after {
    content: var(--tw-content);
    pointer-events: none;
    content: var(--tw-content);
    content: var(--tw-content);
    content: var(--tw-content);
    top: 50%;
    right: calc(var(--spacing) * 2.5);
    content: var(--tw-content);
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
    content: var(--tw-content);
    --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
    translate: var(--tw-translate-x) var(--tw-translate-y);
    content: var(--tw-content);
    background-color: var(--muted-foreground);
    content: var(--tw-content);
    --tw-content: "";
    content: var(--tw-content);
    position: absolute;
    -webkit-mask: url("/static/icons/chevron-down.svg") center / contain no-repeat;
    mask: url("/static/icons/chevron-down.svg") center / contain no-repeat;
  }

  .select.sm select {
    height: calc(var(--spacing) * 8);
  }

  .inline-form {
    align-items: center;
    gap: calc(var(--spacing) * 2);
    flex-wrap: wrap;
    display: flex;
  }

  .inline-form .select, .inline-form input:not([type="hidden"]) {
    width: auto;
  }

  form.inline {
    display: inline;
  }

  .choices {
    gap: calc(var(--spacing) * 3);
    grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
    display: grid;
  }

  .choice {
    cursor: pointer;
    align-items: center;
    gap: calc(var(--spacing) * 3);
    border-radius: calc(var(--radius) * .8);
    border-style: var(--tw-border-style);
    width: 100%;
    padding: calc(var(--spacing) * 3);
    --tw-font-weight: var(--font-weight-normal);
    font-weight: var(--font-weight-normal);
    border-width: 1px;
    display: flex;
  }

  @media (hover: hover) {
    .choice:hover {
      background-color: var(--muted);
    }

    @supports (color: color-mix(in lab, red, red)) {
      .choice:hover {
        background-color: color-mix(in oklab, var(--muted) 50%, transparent);
      }
    }
  }

  .choice:has(:checked) {
    border-color: var(--primary);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .choice:has(:checked) {
      border-color: color-mix(in oklab, var(--primary) 30%, transparent);
    }
  }

  .choice:has(:checked) {
    background-color: var(--primary);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .choice:has(:checked) {
      background-color: color-mix(in oklab, var(--primary) 5%, transparent);
    }
  }

  .choice:has(:focus-visible) {
    border-color: var(--ring);
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    --tw-ring-color: var(--ring);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .choice:has(:focus-visible) {
      --tw-ring-color: color-mix(in oklab, var(--ring) 50%, transparent);
    }
  }

  .choice img {
    height: calc(var(--spacing) * 8);
    flex-shrink: 0;
    width: auto;
  }

  .choice img:where(.dark, .dark *) {
    border-radius: calc(var(--radius) * .6);
  }

  @media (prefers-color-scheme: dark) {
    .choice img:where(:root:not(.light), :root:not(.light) *) {
      border-radius: calc(var(--radius) * .6);
    }
  }

  .choice img:where(.dark, .dark *) {
    background-color: var(--color-white);
  }

  @media (prefers-color-scheme: dark) {
    .choice img:where(:root:not(.light), :root:not(.light) *) {
      background-color: var(--color-white);
    }
  }

  .choice img:where(.dark, .dark *) {
    padding: var(--spacing);
  }

  @media (prefers-color-scheme: dark) {
    .choice img:where(:root:not(.light), :root:not(.light) *) {
      padding: var(--spacing);
    }
  }

  .choice strong {
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    display: block;
  }

  .choice .hint {
    display: block;
  }

  .choice-body {
    gap: var(--spacing);
    --tw-leading: var(--leading-snug);
    min-width: 0;
    line-height: var(--leading-snug);
    flex-direction: column;
    flex: 1;
    display: flex;
  }

  .configure {
    gap: calc(var(--spacing) * 6);
    flex-direction: column;
    display: none;
  }

  form:has(input[name="backend"]:checked) .configure {
    display: flex;
  }

  .empty {
    justify-content: center;
    align-items: center;
    gap: calc(var(--spacing) * 4);
    border-radius: var(--radius);
    border-style: var(--tw-border-style);
    --tw-border-style: dashed;
    width: 100%;
    min-width: 0;
    padding: calc(var(--spacing) * 12);
    text-align: center;
    text-wrap: balance;
    border-style: dashed;
    border-width: 1px;
    flex-direction: column;
    display: flex;
  }

  .empty-header {
    max-width: var(--container-sm);
    align-items: center;
    gap: calc(var(--spacing) * 2);
    flex-direction: column;
    display: flex;
  }

  .empty-media {
    margin-bottom: calc(var(--spacing) * 2);
    width: calc(var(--spacing) * 10);
    height: calc(var(--spacing) * 10);
    border-radius: var(--radius);
    background-color: var(--muted);
    color: var(--foreground);
    flex-shrink: 0;
    justify-content: center;
    align-items: center;
    display: flex;
  }

  .empty-media > .icon {
    width: calc(var(--spacing) * 6);
    height: calc(var(--spacing) * 6);
  }

  .empty-title {
    font-size: var(--text-lg);
    line-height: var(--tw-leading, var(--text-lg--line-height));
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    --tw-tracking: var(--tracking-tight);
    letter-spacing: var(--tracking-tight);
  }

  .empty-description {
    font-size: var(--text-sm);
    line-height: var(--leading-relaxed);
    color: var(--muted-foreground);
  }

  .empty-description a {
    text-decoration-line: underline;
  }

  .page-head {
    justify-content: space-between;
    align-items: flex-start;
    gap: calc(var(--spacing) * 4);
    flex-wrap: wrap;
    display: flex;
  }

  .page-head h1 {
    align-items: center;
    gap: calc(var(--spacing) * 3);
    font-size: var(--text-2xl);
    line-height: var(--tw-leading, var(--text-2xl--line-height));
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
    --tw-tracking: var(--tracking-tight);
    letter-spacing: var(--tracking-tight);
    flex-wrap: wrap;
    display: flex;
  }

  .page-head .sub {
    margin-top: var(--spacing);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    color: var(--muted-foreground);
  }

  .page-head .sub a {
    text-decoration-line: underline;
  }

  .section-head {
    gap: var(--spacing);
    flex-direction: column;
    display: flex;
  }

  .section-head h2 {
    font-size: var(--text-lg);
    line-height: var(--tw-leading, var(--text-lg--line-height));
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
    --tw-tracking: var(--tracking-tight);
    letter-spacing: var(--tracking-tight);
  }

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

  .actions {
    align-items: center;
    gap: calc(var(--spacing) * 2);
    flex-wrap: wrap;
    display: flex;
  }

  .toolbar {
    justify-content: space-between;
    align-items: center;
    gap: calc(var(--spacing) * 4);
    flex-wrap: wrap;
    display: flex;
  }

  dl.kv {
    column-gap: calc(var(--spacing) * 6);
    row-gap: calc(var(--spacing) * 2);
    grid-template-columns: minmax(8rem, max-content) 1fr;
    display: grid;
  }

  @media not all and (min-width: 40rem) {
    dl.kv {
      grid-template-columns: repeat(1, minmax(0, 1fr));
    }
  }

  dl.kv dt {
    color: var(--muted-foreground);
  }

  dl.kv dd {
    overflow-wrap: anywhere;
    min-width: 0;
  }

  .muted {
    color: var(--muted-foreground);
  }

  .muted a {
    text-decoration-line: underline;
  }

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

  .small a {
    text-decoration-line: underline;
  }

  .mono {
    font-family: var(--font-mono);
    font-size: .85em;
  }

  .error {
    color: var(--destructive);
  }

  .meta, .path {
    align-items: center;
    gap: calc(var(--spacing) * 1.5);
    flex-wrap: wrap;
    display: flex;
  }

  ol.steps {
    padding-left: calc(var(--spacing) * 6);
    list-style-type: decimal;
  }

  ol.steps > li {
    margin-bottom: calc(var(--spacing) * 1.5);
  }

  .app-icon {
    width: calc(var(--spacing) * 10);
    height: calc(var(--spacing) * 10);
    border-radius: var(--radius);
    background-color: var(--muted);
    font-size: var(--text-base);
    line-height: var(--tw-leading, var(--text-base--line-height));
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
    justify-content: center;
    align-items: center;
    display: flex;
  }

  pre.code {
    border-radius: var(--radius);
    background-color: var(--color-neutral-950);
    padding: calc(var(--spacing) * 4);
    font-family: var(--font-mono);
    font-size: var(--text-xs);
    line-height: var(--leading-relaxed);
    white-space: pre;
    color: var(--color-neutral-50);
    overflow-x: auto;
  }

  pre.code:where(.dark, .dark *) {
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  @media (prefers-color-scheme: dark) {
    pre.code:where(:root:not(.light), :root:not(.light) *) {
      --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
  }

  pre.code:where(.dark, .dark *) {
    --tw-ring-color: var(--foreground);
  }

  @supports (color: color-mix(in lab, red, red)) {
    pre.code:where(.dark, .dark *) {
      --tw-ring-color: color-mix(in oklab, var(--foreground) 10%, transparent);
    }
  }

  @media (prefers-color-scheme: dark) {
    pre.code:where(:root:not(.light), :root:not(.light) *) {
      --tw-ring-color: var(--foreground);
    }

    @supports (color: color-mix(in lab, red, red)) {
      pre.code:where(:root:not(.light), :root:not(.light) *) {
        --tw-ring-color: color-mix(in oklab, var(--foreground) 10%, transparent);
      }
    }
  }

  #runtime-msg {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    color: var(--muted-foreground);
  }

  #runtime-msg.error {
    color: var(--destructive);
  }

  .logs {
    border-radius: var(--radius);
    background-color: var(--color-neutral-950);
    max-height: 34rem;
    padding-block: calc(var(--spacing) * 3);
    font-family: var(--font-mono);
    font-size: var(--text-xs);
    line-height: var(--leading-relaxed);
    color: var(--color-neutral-50);
    overflow: auto;
  }

  .logs:where(.dark, .dark *) {
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  @media (prefers-color-scheme: dark) {
    .logs:where(:root:not(.light), :root:not(.light) *) {
      --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
  }

  .logs:where(.dark, .dark *) {
    --tw-ring-color: var(--foreground);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .logs:where(.dark, .dark *) {
      --tw-ring-color: color-mix(in oklab, var(--foreground) 10%, transparent);
    }
  }

  @media (prefers-color-scheme: dark) {
    .logs:where(:root:not(.light), :root:not(.light) *) {
      --tw-ring-color: var(--foreground);
    }

    @supports (color: color-mix(in lab, red, red)) {
      .logs:where(:root:not(.light), :root:not(.light) *) {
        --tw-ring-color: color-mix(in oklab, var(--foreground) 10%, transparent);
      }
    }
  }

  .logs div {
    gap: calc(var(--spacing) * 4);
    padding-inline: calc(var(--spacing) * 4);
    overflow-wrap: break-word;
    white-space: pre-wrap;
    grid-template-columns: max-content max-content 1fr;
    display: grid;
  }

  @media (hover: hover) {
    .logs div:hover {
      background-color: #ffffff0d;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .logs div:hover {
        background-color: color-mix(in oklab, var(--color-white) 5%, transparent);
      }
    }
  }

  .logs .t, .logs .p {
    color: var(--color-neutral-400);
  }

  .charts {
    gap: calc(var(--spacing) * 4);
    grid-template-columns: repeat(auto-fit, minmax(20rem, 1fr));
    display: grid;
  }

  .chart {
    border-radius: calc(var(--radius) * 1.4);
    background-color: var(--card);
    padding: calc(var(--spacing) * 4);
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    --tw-ring-color: var(--foreground);
    position: relative;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .chart {
      --tw-ring-color: color-mix(in oklab, var(--foreground) 10%, transparent);
    }
  }

  .chart .head {
    justify-content: space-between;
    align-items: baseline;
    gap: calc(var(--spacing) * 2);
    display: flex;
  }

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

  .chart .value {
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
    --tw-numeric-spacing: tabular-nums;
    font-variant-numeric: var(--tw-ordinal, ) var(--tw-slashed-zero, ) var(--tw-numeric-figure, ) var(--tw-numeric-spacing, ) var(--tw-numeric-fraction, );
  }

  .chart svg {
    margin-top: calc(var(--spacing) * 2);
    width: 100%;
    height: 170px;
    display: block;
    overflow: visible;
  }

  .chart svg:focus-visible {
    outline-style: var(--tw-outline-style);
    outline-offset: 2px;
    outline-width: 2px;
    outline-color: var(--ring);
  }

  .chart svg text {
    fill: var(--muted-foreground);
    --tw-numeric-spacing: tabular-nums;
    font-variant-numeric: var(--tw-ordinal, ) var(--tw-slashed-zero, ) var(--tw-numeric-figure, ) var(--tw-numeric-spacing, ) var(--tw-numeric-fraction, );
    font-size: 11px;
  }

  .chart svg .gridline {
    stroke: var(--border);
  }

  .chart svg .baseline {
    stroke: var(--foreground);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .chart svg .baseline {
      stroke: color-mix(in oklab, var(--foreground) 25%, transparent);
    }
  }

  .chart svg .crosshair {
    stroke: var(--muted-foreground);
  }

  .chart svg .halo {
    stroke: var(--card);
  }

  .legend {
    margin-top: calc(var(--spacing) * 1.5);
    column-gap: calc(var(--spacing) * 4);
    row-gap: var(--spacing);
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    color: var(--muted-foreground);
    flex-wrap: wrap;
    display: flex;
  }

  .legend span:before, .tip span:before {
    content: "";
    margin-right: calc(var(--spacing) * 1.5);
    height: calc(var(--spacing) * .5);
    width: calc(var(--spacing) * 3);
    background-color: var(--c);
    vertical-align: middle;
    display: inline-block;
  }

  .tip {
    pointer-events: none;
    z-index: 10;
    min-width: calc(var(--spacing) * 32);
    align-items: flex-start;
    gap: calc(var(--spacing) * 1.5);
    border-radius: var(--radius);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--border);
    display: grid;
    position: absolute;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .tip {
      border-color: color-mix(in oklab, var(--border) 50%, transparent);
    }
  }

  .tip {
    background-color: var(--background);
    padding-inline: calc(var(--spacing) * 2.5);
    padding-block: calc(var(--spacing) * 1.5);
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    white-space: nowrap;
    --tw-shadow: 0 20px 25px -5px var(--tw-shadow-color, #0000001a), 0 8px 10px -6px var(--tw-shadow-color, #0000001a);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  .tip div {
    align-items: center;
    gap: calc(var(--spacing) * 2);
    display: flex;
  }

  .tip strong {
    font-family: var(--font-mono);
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    color: var(--foreground);
    --tw-numeric-spacing: tabular-nums;
    font-variant-numeric: var(--tw-ordinal, ) var(--tw-slashed-zero, ) var(--tw-numeric-figure, ) var(--tw-numeric-spacing, ) var(--tw-numeric-fraction, );
  }

  .tip span {
    color: var(--muted-foreground);
  }

  .spark {
    margin-left: calc(var(--spacing) * 2);
    vertical-align: middle;
    color: var(--color-blue-600);
    display: inline-block;
  }

  .spark:where(.dark, .dark *) {
    color: var(--color-blue-400);
  }

  @media (prefers-color-scheme: dark) {
    .spark:where(:root:not(.light), :root:not(.light) *) {
      color: var(--color-blue-400);
    }
  }

  .share {
    margin-left: calc(var(--spacing) * 2);
    color: var(--muted-foreground);
  }

  .legend-states {
    align-items: center;
    column-gap: calc(var(--spacing) * 3);
    row-gap: var(--spacing);
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    color: var(--muted-foreground);
    flex-wrap: wrap;
    display: flex;
  }

  .legend-states > span {
    align-items: center;
    gap: calc(var(--spacing) * 1.5);
    display: inline-flex;
  }

  .graph {
    gap: calc(var(--spacing) * 4);
    flex-direction: column;
    display: flex;
  }

  .w0 {
    --wc: var(--engine-0);
  }

  .w1 {
    --wc: var(--engine-1);
  }

  .w2 {
    --wc: var(--engine-2);
  }

  .w3 {
    --wc: var(--engine-3);
  }

  .kind {
    --tw-font-weight: var(--font-weight-medium);
    font-size: 11px;
    font-weight: var(--font-weight-medium);
    --tw-tracking: var(--tracking-wide);
    letter-spacing: var(--tracking-wide);
    color: var(--muted-foreground);
    text-transform: uppercase;
  }

  .ghead {
    margin-bottom: calc(var(--spacing) * 2);
    align-items: center;
    gap: calc(var(--spacing) * 1.5);
    flex-wrap: wrap;
    display: flex;
  }

  .ghead a {
    color: var(--foreground);
    text-decoration-line: none;
  }

  @media (hover: hover) {
    .ghead a:hover {
      text-decoration-line: underline;
    }
  }

  .ws {
    border-radius: calc(var(--radius) * 1.4);
    border-style: var(--tw-border-style);
    --tw-border-style: dashed;
    padding: calc(var(--spacing) * 3);
    border-style: dashed;
    border-width: 1px;
  }

  .envs {
    align-items: stretch;
    gap: calc(var(--spacing) * 2);
    flex-wrap: wrap;
    display: flex;
  }

  @media not all and (min-width: 40rem) {
    .envs {
      flex-direction: column;
    }
  }

  .step {
    font-size: var(--text-lg);
    line-height: var(--tw-leading, var(--text-lg--line-height));
    --tw-leading: 1;
    color: var(--muted-foreground);
    align-self: center;
    line-height: 1;
  }

  @media not all and (min-width: 40rem) {
    .step {
      rotate: 90deg;
    }
  }

  .env {
    min-width: calc(var(--spacing) * 44);
    border-radius: var(--radius);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-left-style: var(--tw-border-style);
    border-left-width: 4px;
    border-left-color: var(--wc, var(--border));
    background-color: var(--card);
    padding: calc(var(--spacing) * 3);
    flex: 0 15rem;
  }

  @media not all and (min-width: 40rem) {
    .env {
      flex: none;
    }
  }

  .env > .ghead {
    flex-wrap: nowrap;
    margin-bottom: 0;
  }

  .env > .ghead strong {
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0;
    overflow: hidden;
  }

  .env .on {
    margin-bottom: var(--spacing);
    text-overflow: ellipsis;
    white-space: nowrap;
    min-height: 1.3em;
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    color: var(--wc, var(--muted-foreground));
    overflow: hidden;
  }

  .dep {
    margin-top: calc(var(--spacing) * 1.5);
    height: calc(var(--spacing) * 8);
    align-items: center;
    gap: calc(var(--spacing) * 2);
    border-radius: calc(var(--radius) * .8);
    border-style: var(--tw-border-style);
    background-color: var(--muted);
    border-width: 1px;
    min-width: 0;
    display: flex;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .dep {
      background-color: color-mix(in oklab, var(--muted) 40%, transparent);
    }
  }

  .dep {
    padding-inline: calc(var(--spacing) * 2.5);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    color: var(--foreground);
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }

  @media (hover: hover) {
    .dep:hover {
      background-color: var(--muted);
    }
  }

  .dep .truncate {
    min-width: 0;
  }

  .dep.none {
    --tw-border-style: dashed;
    color: var(--muted-foreground);
    background-color: #0000;
    border-style: dashed;
  }

  @media (hover: hover) {
    .dep.none:hover {
      background-color: #0000;
    }
  }

  .engines-band {
    gap: calc(var(--spacing) * 4);
    flex-wrap: wrap;
    display: flex;
  }

  .eng {
    border-radius: var(--radius);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-top-style: var(--tw-border-style);
    border-top-width: 4px;
    border-top-color: var(--wc);
    background-color: var(--card);
    padding-inline: calc(var(--spacing) * 3);
    padding-block: calc(var(--spacing) * 2.5);
    flex: 0 21rem;
  }

  .eng:nth-child(4n+1) {
    --wc: var(--engine-0);
  }

  .eng:nth-child(4n+2) {
    --wc: var(--engine-1);
  }

  .eng:nth-child(4n+3) {
    --wc: var(--engine-2);
  }

  .eng:nth-child(4n+4) {
    --wc: var(--engine-3);
  }

  .eng p {
    margin-top: var(--spacing);
  }

  .eng > .ghead {
    margin-bottom: 0;
  }

  .auth {
    justify-content: center;
    align-items: center;
    gap: calc(var(--spacing) * 6);
    background-color: var(--muted);
    min-height: 100svh;
    padding: calc(var(--spacing) * 6);
    flex-direction: column;
    display: flex;
  }

  @media (min-width: 48rem) {
    .auth {
      padding: calc(var(--spacing) * 10);
    }
  }

  .auth-brand {
    align-items: center;
    gap: calc(var(--spacing) * 2);
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    align-self: center;
    display: flex;
  }
}

@layer utilities {
  .visible {
    visibility: visible;
  }

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

  .fixed {
    position: fixed;
  }

  .float-left {
    float: left;
  }

  .container {
    width: 100%;
  }

  @media (min-width: 40rem) {
    .container {
      max-width: 40rem;
    }
  }

  @media (min-width: 48rem) {
    .container {
      max-width: 48rem;
    }
  }

  @media (min-width: 64rem) {
    .container {
      max-width: 64rem;
    }
  }

  @media (min-width: 80rem) {
    .container {
      max-width: 80rem;
    }
  }

  @media (min-width: 96rem) {
    .container {
      max-width: 96rem;
    }
  }

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

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

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

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

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

  .flex {
    display: flex;
  }

  .grid {
    display: grid;
  }

  .hidden {
    display: none;
  }

  .inline {
    display: inline;
  }

  .inline-flex {
    display: inline-flex;
  }

  .table {
    display: table;
  }

  .w-full {
    width: 100%;
  }

  .max-w-60 {
    max-width: calc(var(--spacing) * 60);
  }

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

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

  .min-w-32 {
    min-width: calc(var(--spacing) * 32);
  }

  .flex-1 {
    flex: 1;
  }

  .grow {
    flex-grow: 1;
  }

  .resize {
    resize: both;
  }

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

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

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

  .items-center {
    align-items: center;
  }

  .gap-1\.5 {
    gap: calc(var(--spacing) * 1.5);
  }

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

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

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

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

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

  .self-center {
    align-self: center;
  }

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

  .rounded-xl {
    border-radius: calc(var(--radius) * 1.4);
  }

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

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

  .bg-card {
    background-color: var(--card);
  }

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

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

  .pt-6 {
    padding-top: calc(var(--spacing) * 6);
  }

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

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

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

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

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

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

  .leading-tight {
    --tw-leading: var(--leading-tight);
    line-height: var(--leading-tight);
  }

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

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

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

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

  .tracking-tight {
    --tw-tracking: var(--tracking-tight);
    letter-spacing: var(--tracking-tight);
  }

  .text-muted-foreground {
    color: var(--muted-foreground);
  }

  .underline {
    text-decoration-line: underline;
  }

  .underline-offset-4 {
    text-underline-offset: 4px;
  }

  .blur {
    --tw-blur: blur(8px);
    filter: var(--tw-blur, ) var(--tw-brightness, ) var(--tw-contrast, ) var(--tw-grayscale, ) var(--tw-hue-rotate, ) var(--tw-invert, ) var(--tw-saturate, ) var(--tw-sepia, ) var(--tw-drop-shadow, );
  }

  @media not all and (min-width: 48rem) {
    .max-md\:hidden {
      display: none;
    }
  }

  @media (min-width: 48rem) {
    .md\:hidden {
      display: none;
    }
  }

  .\[\&_tr\>\*\]\:align-top tr > * {
    vertical-align: top;
  }
}

@font-face {
  font-family: Inter Variable;
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url("/static/fonts/inter-latin-wght-normal.woff2") format("woff2-variations");
  unicode-range: U+??, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  color-scheme: light;
  --radius: .625rem;
  --background: oklch(100% 0 0);
  --foreground: oklch(14.5% 0 0);
  --card: oklch(100% 0 0);
  --card-foreground: oklch(14.5% 0 0);
  --popover: oklch(100% 0 0);
  --popover-foreground: oklch(14.5% 0 0);
  --primary: oklch(20.5% 0 0);
  --primary-foreground: oklch(98.5% 0 0);
  --secondary: oklch(97% 0 0);
  --secondary-foreground: oklch(20.5% 0 0);
  --muted: oklch(97% 0 0);
  --muted-foreground: oklch(55.6% 0 0);
  --accent: oklch(97% 0 0);
  --accent-foreground: oklch(20.5% 0 0);
  --destructive: oklch(57.7% .245 27.325);
  --border: oklch(92.2% 0 0);
  --input: oklch(92.2% 0 0);
  --ring: oklch(70.8% 0 0);
  --sidebar: oklch(98.5% 0 0);
  --sidebar-foreground: oklch(14.5% 0 0);
  --sidebar-primary: oklch(20.5% 0 0);
  --sidebar-primary-foreground: oklch(98.5% 0 0);
  --sidebar-accent: oklch(97% 0 0);
  --sidebar-accent-foreground: oklch(20.5% 0 0);
  --sidebar-border: oklch(92.2% 0 0);
  --sidebar-ring: oklch(70.8% 0 0);
  --sidebar-width: 16rem;
  --sidebar-width-icon: 3rem;
  --engine-0: var(--color-orange-600);
  --engine-1: var(--color-blue-600);
  --engine-2: var(--color-green-600);
  --engine-3: var(--color-purple-600);
}

:root:where(.dark, .dark *) {
  color-scheme: dark;
  --background: oklch(14.5% 0 0);
  --foreground: oklch(98.5% 0 0);
  --card: oklch(20.5% 0 0);
  --card-foreground: oklch(98.5% 0 0);
  --popover: oklch(20.5% 0 0);
  --popover-foreground: oklch(98.5% 0 0);
  --primary: oklch(92.2% 0 0);
  --primary-foreground: oklch(20.5% 0 0);
  --secondary: oklch(26.9% 0 0);
  --secondary-foreground: oklch(98.5% 0 0);
  --muted: oklch(26.9% 0 0);
  --muted-foreground: oklch(70.8% 0 0);
  --accent: oklch(26.9% 0 0);
  --accent-foreground: oklch(98.5% 0 0);
  --destructive: oklch(70.4% .191 22.216);
  --border: oklch(100% 0 0 / .1);
  --input: oklch(100% 0 0 / .15);
  --ring: oklch(55.6% 0 0);
  --sidebar: oklch(20.5% 0 0);
  --sidebar-foreground: oklch(98.5% 0 0);
  --sidebar-primary: oklch(48.8% .243 264.376);
  --sidebar-primary-foreground: oklch(98.5% 0 0);
  --sidebar-accent: oklch(26.9% 0 0);
  --sidebar-accent-foreground: oklch(98.5% 0 0);
  --sidebar-border: oklch(100% 0 0 / .1);
  --sidebar-ring: oklch(55.6% 0 0);
  --engine-0: var(--color-orange-400);
  --engine-1: var(--color-blue-400);
  --engine-2: var(--color-green-400);
  --engine-3: var(--color-purple-400);
}

@media (prefers-color-scheme: dark) {
  :root:where(:root:not(.light), :root:not(.light) *) {
    color-scheme: dark;
    --background: oklch(14.5% 0 0);
    --foreground: oklch(98.5% 0 0);
    --card: oklch(20.5% 0 0);
    --card-foreground: oklch(98.5% 0 0);
    --popover: oklch(20.5% 0 0);
    --popover-foreground: oklch(98.5% 0 0);
    --primary: oklch(92.2% 0 0);
    --primary-foreground: oklch(20.5% 0 0);
    --secondary: oklch(26.9% 0 0);
    --secondary-foreground: oklch(98.5% 0 0);
    --muted: oklch(26.9% 0 0);
    --muted-foreground: oklch(70.8% 0 0);
    --accent: oklch(26.9% 0 0);
    --accent-foreground: oklch(98.5% 0 0);
    --destructive: oklch(70.4% .191 22.216);
    --border: oklch(100% 0 0 / .1);
    --input: oklch(100% 0 0 / .15);
    --ring: oklch(55.6% 0 0);
    --sidebar: oklch(20.5% 0 0);
    --sidebar-foreground: oklch(98.5% 0 0);
    --sidebar-primary: oklch(48.8% .243 264.376);
    --sidebar-primary-foreground: oklch(98.5% 0 0);
    --sidebar-accent: oklch(26.9% 0 0);
    --sidebar-accent-foreground: oklch(98.5% 0 0);
    --sidebar-border: oklch(100% 0 0 / .1);
    --sidebar-ring: oklch(55.6% 0 0);
    --engine-0: var(--color-orange-400);
    --engine-1: var(--color-blue-400);
    --engine-2: var(--color-green-400);
    --engine-3: var(--color-purple-400);
  }
}

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

@property --tw-gradient-from {
  syntax: "<color>";
  inherits: false;
  initial-value: #0000;
}

@property --tw-gradient-via {
  syntax: "<color>";
  inherits: false;
  initial-value: #0000;
}

@property --tw-gradient-to {
  syntax: "<color>";
  inherits: false;
  initial-value: #0000;
}

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

@property --tw-gradient-via-stops {
  syntax: "*";
  inherits: false
}

@property --tw-gradient-from-position {
  syntax: "<length-percentage>";
  inherits: false;
  initial-value: 0%;
}

@property --tw-gradient-via-position {
  syntax: "<length-percentage>";
  inherits: false;
  initial-value: 50%;
}

@property --tw-gradient-to-position {
  syntax: "<length-percentage>";
  inherits: false;
  initial-value: 100%;
}

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

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

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

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

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

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

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

@keyframes pulse {
  50% {
    opacity: .5;
  }
}
