/* dist/sensible-ui.css */
/*! tailwindcss v4.2.1 | MIT License | https://tailwindcss.com */
@layer properties;
@layer theme, base, components, utilities;

@layer theme {
  :root, :host {
    --font-sans: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    --color-amber-50: oklch(98.7% .022 95.277);
    --color-amber-100: oklch(96.2% .059 95.617);
    --color-amber-900: oklch(41.4% .112 45.904);
    --color-amber-950: oklch(27.9% .077 45.635);
    --color-blue-600: oklch(54.6% .245 262.881);
    --color-white: #fff;
    --spacing: .25rem;
    --container-sm: 24rem;
    --container-md: 28rem;
    --container-xl: 36rem;
    --container-3xl: 48rem;
    --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);
    --text-3xl: 1.875rem;
    --text-3xl--line-height: calc(2.25 / 1.875);
    --font-weight-normal: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --tracking-tight: -.025em;
    --leading-normal: 1.5;
    --radius-sm: calc(var(--radius)  - 4px);
    --radius-md: calc(var(--radius)  - 2px);
    --radius-lg: var(--radius);
    --radius-xl: calc(var(--radius)  + 4px);
    --ease-out: cubic-bezier(0, 0, .2, 1);
    --ease-in-out: cubic-bezier(.4, 0, .2, 1);
    --animate-spin: spin 1s linear infinite;
    --default-transition-duration: .15s;
    --default-transition-timing-function: cubic-bezier(.4, 0, .2, 1);
    --default-font-family: var(--font-sans);
    --default-mono-font-family: var(--font-mono);
    --color-background: var(--background);
    --color-foreground: var(--foreground);
    --color-card: var(--card);
    --color-card-foreground: var(--card-foreground);
    --color-popover: var(--popover);
    --color-popover-foreground: var(--popover-foreground);
    --color-primary: var(--primary);
    --color-primary-foreground: var(--primary-foreground);
    --color-secondary: var(--secondary);
    --color-secondary-foreground: var(--secondary-foreground);
    --color-muted: var(--muted);
    --color-muted-foreground: var(--muted-foreground);
    --color-accent: var(--accent);
    --color-accent-foreground: var(--accent-foreground);
    --color-destructive: var(--destructive);
    --color-border: var(--border);
    --color-input: var(--input);
    --color-ring: var(--ring);
  }
}

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

  ::backdrop {
    box-sizing: border-box;
    border: 0 solid;
    margin: 0;
    padding: 0;
  }

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

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

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

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

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

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

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

  b, strong {
    font-weight: bolder;
  }

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

  small {
    font-size: 80%;
  }

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

  sub {
    bottom: -.25em;
  }

  sup {
    top: -.5em;
  }

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

  :-moz-focusring {
    outline: auto;
  }

  progress {
    vertical-align: baseline;
  }

  summary {
    display: list-item;
  }

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

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

  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;
  }

  ::-webkit-file-upload-button {
    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:-webkit-any([multiple], [size])) optgroup {
    font-weight: bolder;
  }

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

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

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

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

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

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

  ::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 {
    text-align: inherit;
    min-height: 1lh;
  }

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

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

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

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

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

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

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

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

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

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

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

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

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

  button {
    appearance: button;
  }

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

  ::-webkit-file-upload-button {
    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;
  }
}

@layer utilities {
  .fixed {
    position: fixed;
  }

  .static {
    position: static;
  }

  .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;
    }
  }

  .mx-auto {
    margin-inline-start: auto;
    margin-inline-end: auto;
  }

  .block {
    display: block;
  }

  .contents {
    display: contents;
  }

  .flex {
    display: flex;
  }

  .inline {
    display: inline;
  }

  .table {
    display: table;
  }

  .table\! {
    display: table !important;
  }

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

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

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

  .shrink {
    flex-shrink: 1;
  }

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

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

  .gap-1\! {
    gap: calc(var(--spacing) * 1) !important;
  }

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

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

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

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

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

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

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

  .italic {
    font-style: italic;
  }

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

@layer base {
  * {
    margin: calc(var(--spacing) * 0);
    scroll-margin-top: calc(var(--spacing) * 4);
    overscroll-behavior: none;
    border-color: var(--color-border);
    outline-color: var(--color-ring);
    flex-shrink: 0;
  }

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

  @view-transition {
    navigation: auto;
  }

  html {
    overscroll-behavior: none;
    scroll-behavior: smooth;
  }

  body {
    overscroll-behavior: none;
    background-color: var(--color-background);
    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);
    color: var(--color-foreground);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    scrollbar-gutter: stable;
  }
}

:root {
  --radius: .625rem;
  --background: oklch(1 0 0);
  --foreground: oklch(.145 0 0);
  --card: oklch(1 0 0);
  --card-foreground: oklch(.145 0 0);
  --popover: oklch(1 0 0);
  --popover-foreground: oklch(.145 0 0);
  --primary: oklch(.205 0 0);
  --primary-foreground: oklch(.985 0 0);
  --secondary: oklch(.97 0 0);
  --secondary-foreground: oklch(.205 0 0);
  --muted: oklch(.97 0 0);
  --muted-foreground: oklch(.556 0 0);
  --accent: oklch(.97 0 0);
  --accent-foreground: oklch(.205 0 0);
  --destructive: oklch(.577 .245 27.325);
  --border: oklch(.922 0 0);
  --input: oklch(.922 0 0);
  --ring: oklch(.708 0 0);
  --chart-1: oklch(.646 .222 41.116);
  --chart-2: oklch(.6 .118 184.704);
  --chart-3: oklch(.398 .07 227.392);
  --chart-4: oklch(.828 .189 84.429);
  --chart-5: oklch(.769 .188 70.08);
  --sidebar: oklch(.985 0 0);
  --sidebar-foreground: oklch(.145 0 0);
  --sidebar-primary: oklch(.205 0 0);
  --sidebar-primary-foreground: oklch(.985 0 0);
  --sidebar-accent: oklch(.97 0 0);
  --sidebar-accent-foreground: oklch(.205 0 0);
  --sidebar-border: oklch(.922 0 0);
  --sidebar-ring: oklch(.708 0 0);
  --sidebar-width: 16rem;
  --sidebar-mobile-width: 18rem;
  --scrollbar-track: transparent;
  --scrollbar-thumb: #0000004d;
  --scrollbar-width: 6px;
  --scrollbar-radius: 6px;
  --chevron-down-icon: url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"oklch(0.556 0 0)\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"lucide lucide-chevron-down-icon lucide-chevron-down\"><path d=\"m6 9 6 6 6-6\"/></svg>");
  --chevron-down-icon-50: url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"oklch(0.556 0 0 / 0.5)\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"lucide lucide-chevron-down-icon lucide-chevron-down\"><path d=\"m6 9 6 6 6-6\"/></svg>");
  --check-icon: url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"oklch(0.556 0 0)\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"lucide lucide-check-icon lucide-check\"><path d=\"M20 6 9 17l-5-5\"/></svg>");
}

.dark {
  --background: oklch(.145 0 0);
  --foreground: oklch(.985 0 0);
  --card: oklch(.205 0 0);
  --card-foreground: oklch(.985 0 0);
  --popover: oklch(.269 0 0);
  --popover-foreground: oklch(.985 0 0);
  --primary: oklch(.922 0 0);
  --primary-foreground: oklch(.205 0 0);
  --secondary: oklch(.269 0 0);
  --secondary-foreground: oklch(.985 0 0);
  --muted: oklch(.269 0 0);
  --muted-foreground: oklch(.708 0 0);
  --accent: oklch(.371 0 0);
  --accent-foreground: oklch(.985 0 0);
  --destructive: oklch(.704 .191 22.216);
  --border: oklch(1 0 0 / 10%);
  --input: oklch(1 0 0 / 15%);
  --ring: oklch(.556 0 0);
  --chart-1: oklch(.488 .243 264.376);
  --chart-2: oklch(.696 .17 162.48);
  --chart-3: oklch(.769 .188 70.08);
  --chart-4: oklch(.627 .265 303.9);
  --chart-5: oklch(.645 .246 16.439);
  --sidebar: oklch(.205 0 0);
  --sidebar-foreground: oklch(.985 0 0);
  --sidebar-primary: oklch(.488 .243 264.376);
  --sidebar-primary-foreground: oklch(.985 0 0);
  --sidebar-accent: oklch(.269 0 0);
  --sidebar-accent-foreground: oklch(.985 0 0);
  --sidebar-border: oklch(1 0 0 / 10%);
  --sidebar-ring: oklch(.439 0 0);
  --scrollbar-thumb: #ffffff4d;
  --chevron-down-icon: url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"oklch(0.708 0 0)\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"lucide lucide-chevron-down-icon lucide-chevron-down\"><path d=\"m6 9 6 6 6-6\"/></svg>");
  --chevron-down-icon-50: url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"oklch(0.708 0 0 / 0.5)\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"lucide lucide-chevron-down-icon lucide-chevron-down\"><path d=\"m6 9 6 6 6-6\"/></svg>");
  --check-icon: url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"oklch(0.708 0 0)\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"lucide lucide-check-icon lucide-check\"><path d=\"M20 6 9 17l-5-5\"/></svg>");
  --buncss-light: ;
  --buncss-dark: initial;
  color-scheme: dark;
}

@layer typography {
  h1, h2, h3, h4, h5, h6 {
    scroll-margin: calc(var(--spacing) * 20);
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
    --tw-tracking: var(--tracking-tight);
    letter-spacing: var(--tracking-tight);
    text-wrap: balance;
  }

  :is(h1, h2, h3, h4, h5, h6):first-child {
    margin-block-start: 0;
  }

  p, h1, h2, h3, h4, h5, h6 {
    overflow-wrap: break-word;
  }

  h1 {
    margin-top: calc(var(--spacing) * 10);
    margin-bottom: calc(var(--spacing) * 6);
    font-size: var(--text-3xl);
    line-height: var(--tw-leading, var(--text-3xl--line-height));
    --tw-tracking: var(--tracking-tight);
    letter-spacing: var(--tracking-tight);
    text-wrap: balance;
  }

  h2 {
    margin-top: calc(var(--spacing) * 8);
    margin-bottom: calc(var(--spacing) * 5);
    font-size: var(--text-2xl);
    line-height: var(--tw-leading, var(--text-2xl--line-height));
  }

  h3 {
    margin-top: calc(var(--spacing) * 6);
    margin-bottom: calc(var(--spacing) * 4);
    font-size: var(--text-xl);
    line-height: var(--tw-leading, var(--text-xl--line-height));
  }

  h4 {
    margin-top: calc(var(--spacing) * 5);
    margin-bottom: calc(var(--spacing) * 3);
    font-size: var(--text-lg);
    line-height: var(--tw-leading, var(--text-lg--line-height));
  }

  h5 {
    margin-top: calc(var(--spacing) * 4);
    margin-bottom: calc(var(--spacing) * 2);
    font-size: var(--text-lg);
    line-height: var(--tw-leading, var(--text-lg--line-height));
  }

  h6 {
    margin-top: calc(var(--spacing) * 4);
    margin-bottom: calc(var(--spacing) * 2);
    font-size: var(--text-base);
    line-height: var(--tw-leading, var(--text-base--line-height));
  }

  strong, b {
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
  }

  em, i {
    font-style: italic;
  }

  p {
    margin-bottom: calc(var(--spacing) * 4);
  }

  :not(pre) > :-webkit-any(code, samp) {
    border-radius: var(--radius-sm);
    background-color: var(--color-secondary);
    padding-inline: calc(var(--spacing) * 1);
    padding-block: calc(var(--spacing) * .5);
    font-family: var(--font-mono);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
  }

  :not(pre) > :-moz-any(code, samp) {
    border-radius: var(--radius-sm);
    background-color: var(--color-secondary);
    padding-inline: calc(var(--spacing) * 1);
    padding-block: calc(var(--spacing) * .5);
    font-family: var(--font-mono);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
  }

  :not(pre) > :is(code, samp) {
    border-radius: var(--radius-sm);
    background-color: var(--color-secondary);
    padding-inline: calc(var(--spacing) * 1);
    padding-block: calc(var(--spacing) * .5);
    font-family: var(--font-mono);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
  }

  pre {
    margin-bottom: calc(var(--spacing) * 4);
    overflow-x: auto;
    border-radius: var(--radius-md);
    background-color: var(--color-secondary);
    padding: calc(var(--spacing) * 4);
    font-family: var(--font-mono);
    white-space: pre;
  }

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

  blockquote {
    margin-block: calc(var(--spacing) * 4);
    border-inline-start-style: var(--tw-border-style);
    color: var(--color-muted-foreground);
    border-inline-start-width: 4px;
    padding-inline-start: calc(var(--spacing) * 4);
    font-style: italic;
  }

  hr {
    margin-block: calc(var(--spacing) * 8);
  }

  ul {
    margin-bottom: calc(var(--spacing) * 4);
    list-style-type: disc;
    padding-inline-start: calc(var(--spacing) * 6);
  }

  ul li {
    margin-bottom: calc(var(--spacing) * 1);
  }

  ol {
    margin-bottom: calc(var(--spacing) * 4);
    list-style-type: decimal;
    padding-inline-start: calc(var(--spacing) * 6);
  }

  ol li {
    margin-bottom: calc(var(--spacing) * 1);
  }

  a[href]:not(:-webkit-any(.button, .item)) {
    display: inline-block;
    color: var(--color-foreground);
    text-decoration-line: underline;
    text-underline-offset: 4px;
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-duration: .1s;
    transition-duration: .1s;
  }

  a[href]:not(:-webkit-any(.button, .item)):active {
    --tw-translate-y: 1px;
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  a[href]:not(:-moz-any(.button, .item)) {
    display: inline-block;
    color: var(--color-foreground);
    text-decoration-line: underline;
    text-underline-offset: 4px;
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-duration: .1s;
    transition-duration: .1s;
  }

  a[href]:not(:-moz-any(.button, .item)):active {
    --tw-translate-y: 1px;
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  a[href]:not(:is(.button, .item)) {
    display: inline-block;
    color: var(--color-foreground);
    text-decoration-line: underline;
    text-underline-offset: 4px;
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-duration: .1s;
    transition-duration: .1s;
  }

  a[href]:not(:is(.button, .item)):active {
    --tw-translate-y: 1px;
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  kbd {
    pointer-events: none;
    display: inline-flex;
    height: calc(var(--spacing) * 5);
    min-width: calc(var(--spacing) * 5);
    justify-content: center;
    align-items:  center;
    gap: calc(var(--spacing) * 1);
    border-radius: var(--radius-sm);
    background-color: var(--color-muted);
    padding-inline: calc(var(--spacing) * 1);
    font-family: var(--font-sans);
    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(--color-muted-foreground);
    -webkit-user-select: none;
    user-select: none;
    width: -moz-fit-content;
    width: fit-content;
  }

  kbd svg:not([class*="size-"]) {
    width: calc(var(--spacing) * 3);
    height: calc(var(--spacing) * 3);
  }

  s, del {
    color: var(--color-muted-foreground);
  }

  u, ins, abbr, a[href] {
    text-decoration-color: var(--color-primary);
    text-underline-offset: 4px;
  }

  @supports (color: color-mix(in lab, red, red)) {
    :is(u, ins, abbr, a[href]) {
      text-decoration-color: color-mix(in oklab, var(--color-primary) 20%, transparent);
    }
  }

  :is(u, ins, abbr, a[href]):-webkit-any(a[href]):hover {
    color: var(--color-primary);
    text-decoration-color: var(--color-primary);
  }

  :is(u, ins, abbr, a[href]):-moz-any(a[href]):hover {
    color: var(--color-primary);
    text-decoration-color: var(--color-primary);
  }

  :is(u, ins, abbr, a[href]):is(a[href]):hover {
    color: var(--color-primary);
    text-decoration-color: var(--color-primary);
  }
}

@layer button {
  :not(form[method="dialog"]) > :-webkit-any(button:not([role]), input:-webkit-any([type="submit"], [type="reset"], [type="button"]), a.button) {
    --tw-duration: .15s;
    --tw-ease: var(--ease-out);
    transition-property: transform, translate, scale, rotate;
    transition-duration: .15s;
    transition-timing-function: var(--ease-out);
    display: inline-flex;
    cursor: pointer;
    border-radius: var(--radius-md);
    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;
    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;
    outline-style: none;
    flex-shrink: 0;
    justify-content: center;
    align-items:  center;
  }

  :not(form[method="dialog"]) > :-webkit-any(button:not([role]), input:-webkit-any([type="submit"], [type="reset"], [type="button"]), a.button):active:not(:disabled) {
    --tw-translate-y: calc(var(--spacing) * .5);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  :not(form[method="dialog"]) > :-webkit-any(button:not([role]), input:-webkit-any([type="submit"], [type="reset"], [type="button"]), a.button):focus-visible {
    border-color: var(--color-ring);
  }

  :not(form[method="dialog"]) > :-webkit-any(button:not([role]), input:-webkit-any([type="submit"], [type="reset"], [type="button"]), a.button):focus-visible {
    --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);
  }

  :not(form[method="dialog"]) > :-webkit-any(button:not([role]), input:-webkit-any([type="submit"], [type="reset"], [type="button"]), a.button):focus-visible {
    --tw-ring-color: var(--color-ring);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :-webkit-any(button:not([role]), input:-webkit-any([type="submit"], [type="reset"], [type="button"]), a.button):focus-visible {
      --tw-ring-color: color-mix(in oklab, var(--color-ring) 50%, transparent);
    }
  }

  :not(form[method="dialog"]) > :-webkit-any(button:not([role]), input:-webkit-any([type="submit"], [type="reset"], [type="button"]), a.button):disabled {
    cursor: not-allowed;
  }

  :not(form[method="dialog"]) > :-webkit-any(button:not([role]), input:-webkit-any([type="submit"], [type="reset"], [type="button"]), a.button):disabled {
    opacity: .5;
  }

  :not(form[method="dialog"]) > :-webkit-any(button:not([role]), input:-webkit-any([type="submit"], [type="reset"], [type="button"]), a.button)[aria-invalid="true"] {
    border-color: var(--color-destructive);
  }

  :not(form[method="dialog"]) > :-webkit-any(button:not([role]), input:-webkit-any([type="submit"], [type="reset"], [type="button"]), a.button)[aria-invalid="true"] {
    --tw-ring-color: var(--color-destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :-webkit-any(button:not([role]), input:-webkit-any([type="submit"], [type="reset"], [type="button"]), a.button)[aria-invalid="true"] {
      --tw-ring-color: color-mix(in oklab, var(--color-destructive) 20%, transparent);
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button):is(.dark *)[aria-invalid="true"] {
    --tw-ring-color: var(--color-destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button):is(.dark *)[aria-invalid="true"] {
      --tw-ring-color: color-mix(in oklab, var(--color-destructive) 40%, transparent);
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button) svg {
    pointer-events: none;
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button) svg {
    flex-shrink: 0;
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button) svg:not([class*="size-"]) {
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button):not([data-size]) {
    height: calc(var(--spacing) * 9);
    gap: calc(var(--spacing) * 2);
    padding-inline: calc(var(--spacing) * 4);
    padding-block: calc(var(--spacing) * 2);
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button):not([data-size]):has( > svg) {
    padding-inline: calc(var(--spacing) * 3);
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-size="sm"] {
    height: calc(var(--spacing) * 8);
    gap: calc(var(--spacing) * 1.5);
    padding-inline: calc(var(--spacing) * 3);
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-size="sm"]:has( > svg) {
    padding-inline: calc(var(--spacing) * 2.5);
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-size="lg"] {
    height: calc(var(--spacing) * 10);
    gap: calc(var(--spacing) * 2);
    padding-inline: calc(var(--spacing) * 6);
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-size="lg"]:has( > svg) {
    padding-inline: calc(var(--spacing) * 4);
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-size="icon"] {
    width: calc(var(--spacing) * 9);
    height: calc(var(--spacing) * 9);
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button):not([data-variant]) {
    background-color: var(--color-primary);
    color: var(--color-primary-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) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button):not([data-variant]):hover:not(:disabled) {
      background-color: var(--color-primary);
    }

    @supports (color: color-mix(in lab, red, red)) {
      :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button):not([data-variant]):hover:not(:disabled) {
        background-color: color-mix(in oklab, var(--color-primary) 90%, transparent);
      }
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button):not([data-variant])[aria-pressed="true"] {
    background-color: var(--color-primary);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button):not([data-variant])[aria-pressed="true"] {
      background-color: color-mix(in oklab, var(--color-primary) 90%, transparent);
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="primary"] {
    background-color: var(--color-primary);
    color: var(--color-primary-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) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="primary"]:hover:not(:disabled) {
      background-color: var(--color-primary);
    }

    @supports (color: color-mix(in lab, red, red)) {
      :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="primary"]:hover:not(:disabled) {
        background-color: color-mix(in oklab, var(--color-primary) 90%, transparent);
      }
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="primary"][aria-pressed="true"] {
    background-color: var(--color-primary);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="primary"][aria-pressed="true"] {
      background-color: color-mix(in oklab, var(--color-primary) 90%, transparent);
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="secondary"] {
    background-color: var(--color-secondary);
    color: var(--color-secondary-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);
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="secondary"]:hover:not(disabled) {
    background-color: var(--color-secondary);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="secondary"]:hover:not(disabled) {
      background-color: color-mix(in oklab, var(--color-secondary) 80%, transparent);
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="secondary"][aria-pressed="true"] {
    background-color: var(--color-secondary);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="secondary"][aria-pressed="true"] {
      background-color: color-mix(in oklab, var(--color-secondary) 80%, transparent);
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="outline"] {
    border-style: var(--tw-border-style);
    background-color: var(--color-background);
    --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);
    border-width: 1px;
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="outline"]:is(.dark *) {
    border-color: var(--color-input);
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="outline"]:is(.dark *) {
    background-color: var(--color-input);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="outline"]:is(.dark *) {
      background-color: color-mix(in oklab, var(--color-input) 30%, transparent);
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="outline"]:hover:not(:disabled) {
    background-color: var(--color-accent);
    color: var(--color-accent-foreground);
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="outline"]:hover:not(:disabled):is(.dark *) {
    background-color: var(--color-accent);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="outline"]:hover:not(:disabled):is(.dark *) {
      background-color: color-mix(in oklab, var(--color-accent) 50%, transparent);
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="outline"][aria-pressed="true"] {
    background-color: var(--color-accent);
    color: var(--color-accent-foreground);
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="outline"][aria-pressed="true"]:is(.dark *) {
    background-color: var(--color-accent);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="outline"][aria-pressed="true"]:is(.dark *) {
      background-color: color-mix(in oklab, var(--color-accent) 50%, transparent);
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="ghost"]:hover:not(:disabled) {
    background-color: var(--color-accent);
    color: var(--color-accent-foreground);
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="ghost"]:hover:not(:disabled):is(.dark *) {
    background-color: var(--color-accent);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="ghost"]:hover:not(:disabled):is(.dark *) {
      background-color: color-mix(in oklab, var(--color-accent) 50%, transparent);
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="ghost"][aria-pressed="true"] {
    background-color: var(--color-accent);
    color: var(--color-accent-foreground);
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="ghost"][aria-pressed="true"]:is(.dark *) {
    background-color: var(--color-accent);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="ghost"][aria-pressed="true"]:is(.dark *) {
      background-color: color-mix(in oklab, var(--color-accent) 50%, transparent);
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="link"] {
    color: var(--color-primary);
    text-underline-offset: 4px;
  }

  @media (hover: hover) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="link"]:hover:not(:disabled):hover {
      text-decoration-line: underline;
    }
  }

  @media (hover: hover) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="link"][aria-pressed="true"]:hover {
      text-decoration-line: underline;
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="destructive"] {
    background-color: var(--color-destructive);
    color: var(--color-white);
    --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);
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="destructive"]:focus-visible {
    --tw-ring-color: var(--color-destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="destructive"]:focus-visible {
      --tw-ring-color: color-mix(in oklab, var(--color-destructive) 20%, transparent);
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="destructive"]:is(.dark *) {
    background-color: var(--color-destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="destructive"]:is(.dark *) {
      background-color: color-mix(in oklab, var(--color-destructive) 60%, transparent);
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="destructive"]:is(.dark *):focus-visible {
    --tw-ring-color: var(--color-destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="destructive"]:is(.dark *):focus-visible {
      --tw-ring-color: color-mix(in oklab, var(--color-destructive) 40%, transparent);
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="destructive"]:hover:not(:disabled) {
    background-color: var(--color-destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="destructive"]:hover:not(:disabled) {
      background-color: color-mix(in oklab, var(--color-destructive) 90%, transparent);
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="destructive"]:hover:not(:disabled):is(.dark *) {
    background-color: var(--color-destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="destructive"]:hover:not(:disabled):is(.dark *) {
      background-color: color-mix(in oklab, var(--color-destructive) 50%, transparent);
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="destructive"][aria-pressed="true"] {
    background-color: var(--color-destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="destructive"][aria-pressed="true"] {
      background-color: color-mix(in oklab, var(--color-destructive) 90%, transparent);
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="destructive"][aria-pressed="true"]:is(.dark *) {
    background-color: var(--color-destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="destructive"][aria-pressed="true"]:is(.dark *) {
      background-color: color-mix(in oklab, var(--color-destructive) 50%, transparent);
    }
  }

  :not(form[method="dialog"]) > :-moz-any(button:not([role]), input:-moz-any([type="submit"], [type="reset"], [type="button"]), a.button) {
    --tw-duration: .15s;
    --tw-ease: var(--ease-out);
    transition-property: transform, translate, scale, rotate;
    transition-duration: .15s;
    transition-timing-function: var(--ease-out);
    display: inline-flex;
    cursor: pointer;
    border-radius: var(--radius-md);
    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;
    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;
    outline-style: none;
    flex-shrink: 0;
    justify-content: center;
    align-items:  center;
  }

  :not(form[method="dialog"]) > :-moz-any(button:not([role]), input:-moz-any([type="submit"], [type="reset"], [type="button"]), a.button):active:not(:disabled) {
    --tw-translate-y: calc(var(--spacing) * .5);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  :not(form[method="dialog"]) > :-moz-any(button:not([role]), input:-moz-any([type="submit"], [type="reset"], [type="button"]), a.button):focus-visible {
    border-color: var(--color-ring);
  }

  :not(form[method="dialog"]) > :-moz-any(button:not([role]), input:-moz-any([type="submit"], [type="reset"], [type="button"]), a.button):focus-visible {
    --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);
  }

  :not(form[method="dialog"]) > :-moz-any(button:not([role]), input:-moz-any([type="submit"], [type="reset"], [type="button"]), a.button):focus-visible {
    --tw-ring-color: var(--color-ring);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :-moz-any(button:not([role]), input:-moz-any([type="submit"], [type="reset"], [type="button"]), a.button):focus-visible {
      --tw-ring-color: color-mix(in oklab, var(--color-ring) 50%, transparent);
    }
  }

  :not(form[method="dialog"]) > :-moz-any(button:not([role]), input:-moz-any([type="submit"], [type="reset"], [type="button"]), a.button):disabled {
    cursor: not-allowed;
  }

  :not(form[method="dialog"]) > :-moz-any(button:not([role]), input:-moz-any([type="submit"], [type="reset"], [type="button"]), a.button):disabled {
    opacity: .5;
  }

  :not(form[method="dialog"]) > :-moz-any(button:not([role]), input:-moz-any([type="submit"], [type="reset"], [type="button"]), a.button)[aria-invalid="true"] {
    border-color: var(--color-destructive);
  }

  :not(form[method="dialog"]) > :-moz-any(button:not([role]), input:-moz-any([type="submit"], [type="reset"], [type="button"]), a.button)[aria-invalid="true"] {
    --tw-ring-color: var(--color-destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :-moz-any(button:not([role]), input:-moz-any([type="submit"], [type="reset"], [type="button"]), a.button)[aria-invalid="true"] {
      --tw-ring-color: color-mix(in oklab, var(--color-destructive) 20%, transparent);
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button):is(.dark *)[aria-invalid="true"] {
    --tw-ring-color: var(--color-destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button):is(.dark *)[aria-invalid="true"] {
      --tw-ring-color: color-mix(in oklab, var(--color-destructive) 40%, transparent);
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button) svg {
    pointer-events: none;
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button) svg {
    flex-shrink: 0;
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button) svg:not([class*="size-"]) {
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button):not([data-size]) {
    height: calc(var(--spacing) * 9);
    gap: calc(var(--spacing) * 2);
    padding-inline: calc(var(--spacing) * 4);
    padding-block: calc(var(--spacing) * 2);
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button):not([data-size]):has( > svg) {
    padding-inline: calc(var(--spacing) * 3);
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-size="sm"] {
    height: calc(var(--spacing) * 8);
    gap: calc(var(--spacing) * 1.5);
    padding-inline: calc(var(--spacing) * 3);
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-size="sm"]:has( > svg) {
    padding-inline: calc(var(--spacing) * 2.5);
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-size="lg"] {
    height: calc(var(--spacing) * 10);
    gap: calc(var(--spacing) * 2);
    padding-inline: calc(var(--spacing) * 6);
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-size="lg"]:has( > svg) {
    padding-inline: calc(var(--spacing) * 4);
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-size="icon"] {
    width: calc(var(--spacing) * 9);
    height: calc(var(--spacing) * 9);
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button):not([data-variant]) {
    background-color: var(--color-primary);
    color: var(--color-primary-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) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button):not([data-variant]):hover:not(:disabled) {
      background-color: var(--color-primary);
    }

    @supports (color: color-mix(in lab, red, red)) {
      :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button):not([data-variant]):hover:not(:disabled) {
        background-color: color-mix(in oklab, var(--color-primary) 90%, transparent);
      }
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button):not([data-variant])[aria-pressed="true"] {
    background-color: var(--color-primary);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button):not([data-variant])[aria-pressed="true"] {
      background-color: color-mix(in oklab, var(--color-primary) 90%, transparent);
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="primary"] {
    background-color: var(--color-primary);
    color: var(--color-primary-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) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="primary"]:hover:not(:disabled) {
      background-color: var(--color-primary);
    }

    @supports (color: color-mix(in lab, red, red)) {
      :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="primary"]:hover:not(:disabled) {
        background-color: color-mix(in oklab, var(--color-primary) 90%, transparent);
      }
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="primary"][aria-pressed="true"] {
    background-color: var(--color-primary);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="primary"][aria-pressed="true"] {
      background-color: color-mix(in oklab, var(--color-primary) 90%, transparent);
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="secondary"] {
    background-color: var(--color-secondary);
    color: var(--color-secondary-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);
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="secondary"]:hover:not(disabled) {
    background-color: var(--color-secondary);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="secondary"]:hover:not(disabled) {
      background-color: color-mix(in oklab, var(--color-secondary) 80%, transparent);
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="secondary"][aria-pressed="true"] {
    background-color: var(--color-secondary);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="secondary"][aria-pressed="true"] {
      background-color: color-mix(in oklab, var(--color-secondary) 80%, transparent);
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="outline"] {
    border-style: var(--tw-border-style);
    background-color: var(--color-background);
    --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);
    border-width: 1px;
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="outline"]:is(.dark *) {
    border-color: var(--color-input);
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="outline"]:is(.dark *) {
    background-color: var(--color-input);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="outline"]:is(.dark *) {
      background-color: color-mix(in oklab, var(--color-input) 30%, transparent);
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="outline"]:hover:not(:disabled) {
    background-color: var(--color-accent);
    color: var(--color-accent-foreground);
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="outline"]:hover:not(:disabled):is(.dark *) {
    background-color: var(--color-accent);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="outline"]:hover:not(:disabled):is(.dark *) {
      background-color: color-mix(in oklab, var(--color-accent) 50%, transparent);
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="outline"][aria-pressed="true"] {
    background-color: var(--color-accent);
    color: var(--color-accent-foreground);
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="outline"][aria-pressed="true"]:is(.dark *) {
    background-color: var(--color-accent);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="outline"][aria-pressed="true"]:is(.dark *) {
      background-color: color-mix(in oklab, var(--color-accent) 50%, transparent);
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="ghost"]:hover:not(:disabled) {
    background-color: var(--color-accent);
    color: var(--color-accent-foreground);
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="ghost"]:hover:not(:disabled):is(.dark *) {
    background-color: var(--color-accent);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="ghost"]:hover:not(:disabled):is(.dark *) {
      background-color: color-mix(in oklab, var(--color-accent) 50%, transparent);
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="ghost"][aria-pressed="true"] {
    background-color: var(--color-accent);
    color: var(--color-accent-foreground);
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="ghost"][aria-pressed="true"]:is(.dark *) {
    background-color: var(--color-accent);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="ghost"][aria-pressed="true"]:is(.dark *) {
      background-color: color-mix(in oklab, var(--color-accent) 50%, transparent);
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="link"] {
    color: var(--color-primary);
    text-underline-offset: 4px;
  }

  @media (hover: hover) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="link"]:hover:not(:disabled):hover {
      text-decoration-line: underline;
    }
  }

  @media (hover: hover) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="link"][aria-pressed="true"]:hover {
      text-decoration-line: underline;
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="destructive"] {
    background-color: var(--color-destructive);
    color: var(--color-white);
    --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);
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="destructive"]:focus-visible {
    --tw-ring-color: var(--color-destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="destructive"]:focus-visible {
      --tw-ring-color: color-mix(in oklab, var(--color-destructive) 20%, transparent);
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="destructive"]:is(.dark *) {
    background-color: var(--color-destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="destructive"]:is(.dark *) {
      background-color: color-mix(in oklab, var(--color-destructive) 60%, transparent);
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="destructive"]:is(.dark *):focus-visible {
    --tw-ring-color: var(--color-destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="destructive"]:is(.dark *):focus-visible {
      --tw-ring-color: color-mix(in oklab, var(--color-destructive) 40%, transparent);
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="destructive"]:hover:not(:disabled) {
    background-color: var(--color-destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="destructive"]:hover:not(:disabled) {
      background-color: color-mix(in oklab, var(--color-destructive) 90%, transparent);
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="destructive"]:hover:not(:disabled):is(.dark *) {
    background-color: var(--color-destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="destructive"]:hover:not(:disabled):is(.dark *) {
      background-color: color-mix(in oklab, var(--color-destructive) 50%, transparent);
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="destructive"][aria-pressed="true"] {
    background-color: var(--color-destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="destructive"][aria-pressed="true"] {
      background-color: color-mix(in oklab, var(--color-destructive) 90%, transparent);
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="destructive"][aria-pressed="true"]:is(.dark *) {
    background-color: var(--color-destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="destructive"][aria-pressed="true"]:is(.dark *) {
      background-color: color-mix(in oklab, var(--color-destructive) 50%, transparent);
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button) {
    --tw-duration: .15s;
    --tw-ease: var(--ease-out);
    transition-property: transform, translate, scale, rotate;
    transition-duration: .15s;
    transition-timing-function: var(--ease-out);
    display: inline-flex;
    cursor: pointer;
    border-radius: var(--radius-md);
    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;
    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;
    outline-style: none;
    flex-shrink: 0;
    justify-content: center;
    align-items:  center;
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button):active:not(:disabled) {
    --tw-translate-y: calc(var(--spacing) * .5);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button):focus-visible {
    border-color: var(--color-ring);
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button):focus-visible {
    --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);
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button):focus-visible {
    --tw-ring-color: var(--color-ring);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button):focus-visible {
      --tw-ring-color: color-mix(in oklab, var(--color-ring) 50%, transparent);
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button):disabled {
    cursor: not-allowed;
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button):disabled {
    opacity: .5;
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[aria-invalid="true"] {
    border-color: var(--color-destructive);
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[aria-invalid="true"] {
    --tw-ring-color: var(--color-destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[aria-invalid="true"] {
      --tw-ring-color: color-mix(in oklab, var(--color-destructive) 20%, transparent);
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button):is(.dark *)[aria-invalid="true"] {
    --tw-ring-color: var(--color-destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button):is(.dark *)[aria-invalid="true"] {
      --tw-ring-color: color-mix(in oklab, var(--color-destructive) 40%, transparent);
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button) svg {
    pointer-events: none;
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button) svg {
    flex-shrink: 0;
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button) svg:not([class*="size-"]) {
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button):not([data-size]) {
    height: calc(var(--spacing) * 9);
    gap: calc(var(--spacing) * 2);
    padding-inline: calc(var(--spacing) * 4);
    padding-block: calc(var(--spacing) * 2);
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button):not([data-size]):has( > svg) {
    padding-inline: calc(var(--spacing) * 3);
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-size="sm"] {
    height: calc(var(--spacing) * 8);
    gap: calc(var(--spacing) * 1.5);
    padding-inline: calc(var(--spacing) * 3);
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-size="sm"]:has( > svg) {
    padding-inline: calc(var(--spacing) * 2.5);
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-size="lg"] {
    height: calc(var(--spacing) * 10);
    gap: calc(var(--spacing) * 2);
    padding-inline: calc(var(--spacing) * 6);
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-size="lg"]:has( > svg) {
    padding-inline: calc(var(--spacing) * 4);
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-size="icon"] {
    width: calc(var(--spacing) * 9);
    height: calc(var(--spacing) * 9);
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button):not([data-variant]) {
    background-color: var(--color-primary);
    color: var(--color-primary-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) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button):not([data-variant]):hover:not(:disabled) {
      background-color: var(--color-primary);
    }

    @supports (color: color-mix(in lab, red, red)) {
      :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button):not([data-variant]):hover:not(:disabled) {
        background-color: color-mix(in oklab, var(--color-primary) 90%, transparent);
      }
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button):not([data-variant])[aria-pressed="true"] {
    background-color: var(--color-primary);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button):not([data-variant])[aria-pressed="true"] {
      background-color: color-mix(in oklab, var(--color-primary) 90%, transparent);
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="primary"] {
    background-color: var(--color-primary);
    color: var(--color-primary-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) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="primary"]:hover:not(:disabled) {
      background-color: var(--color-primary);
    }

    @supports (color: color-mix(in lab, red, red)) {
      :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="primary"]:hover:not(:disabled) {
        background-color: color-mix(in oklab, var(--color-primary) 90%, transparent);
      }
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="primary"][aria-pressed="true"] {
    background-color: var(--color-primary);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="primary"][aria-pressed="true"] {
      background-color: color-mix(in oklab, var(--color-primary) 90%, transparent);
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="secondary"] {
    background-color: var(--color-secondary);
    color: var(--color-secondary-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);
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="secondary"]:hover:not(disabled) {
    background-color: var(--color-secondary);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="secondary"]:hover:not(disabled) {
      background-color: color-mix(in oklab, var(--color-secondary) 80%, transparent);
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="secondary"][aria-pressed="true"] {
    background-color: var(--color-secondary);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="secondary"][aria-pressed="true"] {
      background-color: color-mix(in oklab, var(--color-secondary) 80%, transparent);
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="outline"] {
    border-style: var(--tw-border-style);
    background-color: var(--color-background);
    --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);
    border-width: 1px;
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="outline"]:is(.dark *) {
    border-color: var(--color-input);
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="outline"]:is(.dark *) {
    background-color: var(--color-input);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="outline"]:is(.dark *) {
      background-color: color-mix(in oklab, var(--color-input) 30%, transparent);
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="outline"]:hover:not(:disabled) {
    background-color: var(--color-accent);
    color: var(--color-accent-foreground);
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="outline"]:hover:not(:disabled):is(.dark *) {
    background-color: var(--color-accent);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="outline"]:hover:not(:disabled):is(.dark *) {
      background-color: color-mix(in oklab, var(--color-accent) 50%, transparent);
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="outline"][aria-pressed="true"] {
    background-color: var(--color-accent);
    color: var(--color-accent-foreground);
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="outline"][aria-pressed="true"]:is(.dark *) {
    background-color: var(--color-accent);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="outline"][aria-pressed="true"]:is(.dark *) {
      background-color: color-mix(in oklab, var(--color-accent) 50%, transparent);
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="ghost"]:hover:not(:disabled) {
    background-color: var(--color-accent);
    color: var(--color-accent-foreground);
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="ghost"]:hover:not(:disabled):is(.dark *) {
    background-color: var(--color-accent);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="ghost"]:hover:not(:disabled):is(.dark *) {
      background-color: color-mix(in oklab, var(--color-accent) 50%, transparent);
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="ghost"][aria-pressed="true"] {
    background-color: var(--color-accent);
    color: var(--color-accent-foreground);
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="ghost"][aria-pressed="true"]:is(.dark *) {
    background-color: var(--color-accent);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="ghost"][aria-pressed="true"]:is(.dark *) {
      background-color: color-mix(in oklab, var(--color-accent) 50%, transparent);
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="link"] {
    color: var(--color-primary);
    text-underline-offset: 4px;
  }

  @media (hover: hover) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="link"]:hover:not(:disabled):hover {
      text-decoration-line: underline;
    }
  }

  @media (hover: hover) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="link"][aria-pressed="true"]:hover {
      text-decoration-line: underline;
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="destructive"] {
    background-color: var(--color-destructive);
    color: var(--color-white);
    --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);
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="destructive"]:focus-visible {
    --tw-ring-color: var(--color-destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="destructive"]:focus-visible {
      --tw-ring-color: color-mix(in oklab, var(--color-destructive) 20%, transparent);
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="destructive"]:is(.dark *) {
    background-color: var(--color-destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="destructive"]:is(.dark *) {
      background-color: color-mix(in oklab, var(--color-destructive) 60%, transparent);
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="destructive"]:is(.dark *):focus-visible {
    --tw-ring-color: var(--color-destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="destructive"]:is(.dark *):focus-visible {
      --tw-ring-color: color-mix(in oklab, var(--color-destructive) 40%, transparent);
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="destructive"]:hover:not(:disabled) {
    background-color: var(--color-destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="destructive"]:hover:not(:disabled) {
      background-color: color-mix(in oklab, var(--color-destructive) 90%, transparent);
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="destructive"]:hover:not(:disabled):is(.dark *) {
    background-color: var(--color-destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="destructive"]:hover:not(:disabled):is(.dark *) {
      background-color: color-mix(in oklab, var(--color-destructive) 50%, transparent);
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="destructive"][aria-pressed="true"] {
    background-color: var(--color-destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="destructive"][aria-pressed="true"] {
      background-color: color-mix(in oklab, var(--color-destructive) 90%, transparent);
    }
  }

  :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="destructive"][aria-pressed="true"]:is(.dark *) {
    background-color: var(--color-destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :not(form[method="dialog"]) > :is(button:not([role]), input:is([type="submit"], [type="reset"], [type="button"]), a.button)[data-variant="destructive"][aria-pressed="true"]:is(.dark *) {
      background-color: color-mix(in oklab, var(--color-destructive) 50%, transparent);
    }
  }
}

@layer components {
  a > .badge {
    transition-property: transform, translate, scale, rotate;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-duration: .15s;
    --tw-ease: var(--ease-out);
    transition-duration: .15s;
    transition-timing-function: var(--ease-out);
  }

  a > .badge:active:not(:disabled) {
    --tw-translate-y: calc(var(--spacing) * .5);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  a.badge {
    text-decoration-line: none !important;
  }

  .badge {
    display: inline-flex;
    justify-content: center;
    align-items:  center;
    gap: calc(var(--spacing) * 1);
    overflow: hidden;
    border-style: var(--tw-border-style);
    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;
    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));
    border-width: 1px;
    border-radius: 3.40282e38px;
    flex-shrink: 0;
    width: -moz-fit-content;
    width: fit-content;
  }

  .badge:focus-visible {
    border-color: var(--color-ring);
  }

  .badge:focus-visible {
    --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);
  }

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

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

  .badge[aria-invalid="true"] {
    border-color: var(--color-destructive);
  }

  .badge[aria-invalid="true"] {
    --tw-ring-color: var(--color-destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .badge[aria-invalid="true"] {
      --tw-ring-color: color-mix(in oklab, var(--color-destructive) 20%, transparent);
    }
  }

  .badge:is(.dark *)[aria-invalid="true"] {
    --tw-ring-color: var(--color-destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .badge:is(.dark *)[aria-invalid="true"] {
      --tw-ring-color: color-mix(in oklab, var(--color-destructive) 40%, transparent);
    }
  }

  .badge > svg {
    pointer-events: none;
  }

  .badge > svg {
    width: calc(var(--spacing) * 3);
    height: calc(var(--spacing) * 3);
  }

  .badge:not([variant]) {
    background-color: var(--color-primary);
    color: var(--color-primary-foreground);
    border-color: #0000;
  }

  @media (hover: hover) {
    a.badge:not([variant]):hover {
      background-color: var(--color-primary);
    }

    @supports (color: color-mix(in lab, red, red)) {
      a.badge:not([variant]):hover {
        background-color: color-mix(in oklab, var(--color-primary) 90%, transparent);
      }
    }
  }

  .badge[data-variant="primary"] {
    background-color: var(--color-primary);
    color: var(--color-primary-foreground);
    border-color: #0000;
  }

  @media (hover: hover) {
    a.badge[data-variant="primary"]:hover {
      background-color: var(--color-primary);
    }

    @supports (color: color-mix(in lab, red, red)) {
      a.badge[data-variant="primary"]:hover {
        background-color: color-mix(in oklab, var(--color-primary) 90%, transparent);
      }
    }
  }

  .badge[data-variant="secondary"] {
    background-color: var(--color-secondary);
    color: var(--color-secondary-foreground);
    border-color: #0000;
  }

  @media (hover: hover) {
    a.badge[data-variant="secondary"]:hover {
      background-color: var(--color-secondary);
    }

    @supports (color: color-mix(in lab, red, red)) {
      a.badge[data-variant="secondary"]:hover {
        background-color: color-mix(in oklab, var(--color-secondary) 90%, transparent);
      }
    }
  }

  .badge[data-variant="destructive"] {
    background-color: var(--color-destructive);
    color: var(--color-white);
    border-color: #0000;
  }

  .badge[data-variant="destructive"]:focus-visible {
    --tw-ring-color: var(--color-destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .badge[data-variant="destructive"]:focus-visible {
      --tw-ring-color: color-mix(in oklab, var(--color-destructive) 20%, transparent);
    }
  }

  .badge[data-variant="destructive"]:is(.dark *) {
    background-color: var(--color-destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .badge[data-variant="destructive"]:is(.dark *) {
      background-color: color-mix(in oklab, var(--color-destructive) 60%, transparent);
    }
  }

  .badge[data-variant="destructive"]:is(.dark *):focus-visible {
    --tw-ring-color: var(--color-destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .badge[data-variant="destructive"]:is(.dark *):focus-visible {
      --tw-ring-color: color-mix(in oklab, var(--color-destructive) 40%, transparent);
    }
  }

  @media (hover: hover) {
    a.badge[data-variant="destructive"]:hover {
      background-color: var(--color-destructive);
    }

    @supports (color: color-mix(in lab, red, red)) {
      a.badge[data-variant="destructive"]:hover {
        background-color: color-mix(in oklab, var(--color-destructive) 90%, transparent);
      }
    }
  }

  .badge[data-variant="outline"] {
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-border);
    background-color: unset;
    color: var(--color-foreground);
  }

  @media (hover: hover) {
    a.badge[data-variant="outline"]:hover {
      background-color: var(--color-accent);
    }
  }

  @media (hover: hover) {
    a.badge[data-variant="outline"]:hover {
      color: var(--color-accent-foreground);
    }
  }
}

@layer components {
  .card {
    display: flex;
    gap: calc(var(--spacing) * 6);
    border-radius: var(--radius-xl);
    border-style: var(--tw-border-style);
    background-color: var(--color-card);
    padding-block: calc(var(--spacing) * 4);
    color: var(--color-card-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);
    border-width: 1px;
    flex-direction: column;
  }

  .card:has( > footer) {
    padding-top: calc(var(--spacing) * 4);
    padding-bottom: calc(var(--spacing) * 0);
  }

  .card > header {
    container-type: inline-size;
    container-name: card-header;
    display: grid;
    grid-auto-rows: min-content;
    grid-template-rows: auto auto;
    align-items:  flex-start;
    gap: calc(var(--spacing) * 1.5);
    padding-inline: calc(var(--spacing) * 4);
  }

  .card > header:has([data-slot="card-action"]) {
    grid-template-columns: 1fr auto;
  }

  .card > header.border-b {
    padding-bottom: calc(var(--spacing) * 6);
  }

  .card > header :-webkit-any(h2, h3, h4, h5, h6) {
    --tw-leading: 1;
    --tw-font-weight: var(--font-weight-semibold);
    line-height: 1;
    font-weight: var(--font-weight-semibold);
    margin: calc(var(--spacing) * 0) !important;
    padding: calc(var(--spacing) * 0) !important;
    font-size: var(--text-base) !important;
    line-height: var(--tw-leading, var(--text-base--line-height)) !important;
  }

  .card > header :-moz-any(h2, h3, h4, h5, h6) {
    --tw-leading: 1;
    --tw-font-weight: var(--font-weight-semibold);
    line-height: 1;
    font-weight: var(--font-weight-semibold);
    margin: calc(var(--spacing) * 0) !important;
    padding: calc(var(--spacing) * 0) !important;
    font-size: var(--text-base) !important;
    line-height: var(--tw-leading, var(--text-base--line-height)) !important;
  }

  .card > header :is(h2, h3, h4, h5, h6) {
    --tw-leading: 1;
    --tw-font-weight: var(--font-weight-semibold);
    line-height: 1;
    font-weight: var(--font-weight-semibold);
    margin: calc(var(--spacing) * 0) !important;
    padding: calc(var(--spacing) * 0) !important;
    font-size: var(--text-base) !important;
    line-height: var(--tw-leading, var(--text-base--line-height)) !important;
  }

  .card > header :-webkit-any(p, span) {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    color: var(--color-muted-foreground);
    margin: calc(var(--spacing) * 0) !important;
    padding: calc(var(--spacing) * 0) !important;
  }

  .card > header :-moz-any(p, span) {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    color: var(--color-muted-foreground);
    margin: calc(var(--spacing) * 0) !important;
    padding: calc(var(--spacing) * 0) !important;
  }

  .card > header :is(p, span) {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    color: var(--color-muted-foreground);
    margin: calc(var(--spacing) * 0) !important;
    padding: calc(var(--spacing) * 0) !important;
  }

  .card > section {
    padding-inline: calc(var(--spacing) * 4);
  }

  .card > section > :last-child {
    margin-bottom: calc(var(--spacing) * 0) !important;
  }

  .card > footer {
    display: grid;
    grid-template-rows: repeat(2, minmax(0, 1fr));
    align-items:  center;
    gap: calc(var(--spacing) * 3);
    border-bottom-right-radius: var(--radius-xl);
    border-bottom-left-radius: var(--radius-xl);
    background-color: var(--color-secondary);
    padding: calc(var(--spacing) * 4);
  }
}

@layer components {
  form {
    display: flex;
    gap: calc(var(--spacing) * 4);
    flex-direction: column;
  }

  input:not(:-webkit-any([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role])) {
    display: flex;
    height: calc(var(--spacing) * 9);
    min-width: calc(var(--spacing) * 0);
    appearance: none;
    border-radius: var(--radius-md);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-input);
    padding-inline: calc(var(--spacing) * 3);
    padding-block: calc(var(--spacing) * 1);
    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;
    outline-style: none;
    background-color: #0000;
    width: 100%;
  }

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role])) *::selection {
    background-color: var(--color-primary);
  }

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role]))::selection {
    background-color: var(--color-primary);
  }

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role])) *::selection {
    color: var(--color-primary-foreground);
  }

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role]))::selection {
    color: var(--color-primary-foreground);
  }

  input:not(:-webkit-any([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role]))::-webkit-file-upload-button {
    display: inline-flex;
  }

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role]))::file-selector-button {
    display: inline-flex;
  }

  input:not(:-webkit-any([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role]))::-webkit-file-upload-button {
    height: calc(var(--spacing) * 7);
  }

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role]))::file-selector-button {
    height: calc(var(--spacing) * 7);
  }

  input:not(:-webkit-any([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role]))::-webkit-file-upload-button {
    border-style: var(--tw-border-style);
    border-width: 0;
  }

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role]))::file-selector-button {
    border-style: var(--tw-border-style);
    border-width: 0;
  }

  input:not(:-webkit-any([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role]))::-webkit-file-upload-button {
    background-color: #0000;
  }

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role]))::file-selector-button {
    background-color: #0000;
  }

  input:not(:-webkit-any([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role]))::-webkit-file-upload-button {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
  }

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role]))::file-selector-button {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
  }

  input:not(:-webkit-any([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role]))::-webkit-file-upload-button {
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
  }

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role]))::file-selector-button {
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
  }

  input:not(:-webkit-any([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role]))::-webkit-file-upload-button {
    color: var(--color-foreground);
  }

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role]))::file-selector-button {
    color: var(--color-foreground);
  }

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

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role])):disabled {
    pointer-events: none;
  }

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role])):disabled {
    cursor: not-allowed;
  }

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role])):disabled {
    opacity: .5;
  }

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

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

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

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role])):focus-visible {
    border-color: var(--color-ring);
  }

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role])):focus-visible {
    --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);
  }

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role])):focus-visible {
    --tw-ring-color: var(--color-ring);
  }

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

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role]))[aria-invalid="true"] {
    border-color: var(--color-destructive);
  }

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role]))[aria-invalid="true"] {
    --tw-ring-color: var(--color-destructive);
  }

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

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role])):is(.dark *)[aria-invalid="true"] {
    --tw-ring-color: var(--color-destructive);
  }

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

  input:not(:-moz-any([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role])) {
    display: flex;
    height: calc(var(--spacing) * 9);
    min-width: calc(var(--spacing) * 0);
    appearance: none;
    border-radius: var(--radius-md);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-input);
    padding-inline: calc(var(--spacing) * 3);
    padding-block: calc(var(--spacing) * 1);
    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;
    outline-style: none;
    background-color: #0000;
    width: 100%;
  }

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role])) *::selection {
    background-color: var(--color-primary);
  }

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role]))::selection {
    background-color: var(--color-primary);
  }

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role])) *::selection {
    color: var(--color-primary-foreground);
  }

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role]))::selection {
    color: var(--color-primary-foreground);
  }

  input:not(:-webkit-any([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role]))::-webkit-file-upload-button {
    display: inline-flex;
  }

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role]))::file-selector-button {
    display: inline-flex;
  }

  input:not(:-webkit-any([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role]))::-webkit-file-upload-button {
    height: calc(var(--spacing) * 7);
  }

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role]))::file-selector-button {
    height: calc(var(--spacing) * 7);
  }

  input:not(:-webkit-any([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role]))::-webkit-file-upload-button {
    border-style: var(--tw-border-style);
    border-width: 0;
  }

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role]))::file-selector-button {
    border-style: var(--tw-border-style);
    border-width: 0;
  }

  input:not(:-webkit-any([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role]))::-webkit-file-upload-button {
    background-color: #0000;
  }

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role]))::file-selector-button {
    background-color: #0000;
  }

  input:not(:-webkit-any([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role]))::-webkit-file-upload-button {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
  }

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role]))::file-selector-button {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
  }

  input:not(:-webkit-any([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role]))::-webkit-file-upload-button {
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
  }

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role]))::file-selector-button {
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
  }

  input:not(:-webkit-any([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role]))::-webkit-file-upload-button {
    color: var(--color-foreground);
  }

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role]))::file-selector-button {
    color: var(--color-foreground);
  }

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

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role])):disabled {
    pointer-events: none;
  }

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role])):disabled {
    cursor: not-allowed;
  }

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role])):disabled {
    opacity: .5;
  }

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

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

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

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role])):focus-visible {
    border-color: var(--color-ring);
  }

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role])):focus-visible {
    --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);
  }

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role])):focus-visible {
    --tw-ring-color: var(--color-ring);
  }

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

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role]))[aria-invalid="true"] {
    border-color: var(--color-destructive);
  }

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role]))[aria-invalid="true"] {
    --tw-ring-color: var(--color-destructive);
  }

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

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role])):is(.dark *)[aria-invalid="true"] {
    --tw-ring-color: var(--color-destructive);
  }

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

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role])) {
    display: flex;
    height: calc(var(--spacing) * 9);
    min-width: calc(var(--spacing) * 0);
    appearance: none;
    border-radius: var(--radius-md);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-input);
    padding-inline: calc(var(--spacing) * 3);
    padding-block: calc(var(--spacing) * 1);
    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;
    outline-style: none;
    background-color: #0000;
    width: 100%;
  }

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role])) *::selection {
    background-color: var(--color-primary);
  }

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role]))::selection {
    background-color: var(--color-primary);
  }

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role])) *::selection {
    color: var(--color-primary-foreground);
  }

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role]))::selection {
    color: var(--color-primary-foreground);
  }

  input:not(:-webkit-any([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role]))::-webkit-file-upload-button {
    display: inline-flex;
  }

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role]))::file-selector-button {
    display: inline-flex;
  }

  input:not(:-webkit-any([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role]))::-webkit-file-upload-button {
    height: calc(var(--spacing) * 7);
  }

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role]))::file-selector-button {
    height: calc(var(--spacing) * 7);
  }

  input:not(:-webkit-any([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role]))::-webkit-file-upload-button {
    border-style: var(--tw-border-style);
    border-width: 0;
  }

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role]))::file-selector-button {
    border-style: var(--tw-border-style);
    border-width: 0;
  }

  input:not(:-webkit-any([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role]))::-webkit-file-upload-button {
    background-color: #0000;
  }

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role]))::file-selector-button {
    background-color: #0000;
  }

  input:not(:-webkit-any([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role]))::-webkit-file-upload-button {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
  }

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role]))::file-selector-button {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
  }

  input:not(:-webkit-any([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role]))::-webkit-file-upload-button {
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
  }

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role]))::file-selector-button {
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
  }

  input:not(:-webkit-any([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role]))::-webkit-file-upload-button {
    color: var(--color-foreground);
  }

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role]))::file-selector-button {
    color: var(--color-foreground);
  }

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

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role])):disabled {
    pointer-events: none;
  }

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role])):disabled {
    cursor: not-allowed;
  }

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role])):disabled {
    opacity: .5;
  }

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

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

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

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role])):focus-visible {
    border-color: var(--color-ring);
  }

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role])):focus-visible {
    --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);
  }

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role])):focus-visible {
    --tw-ring-color: var(--color-ring);
  }

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

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role]))[aria-invalid="true"] {
    border-color: var(--color-destructive);
  }

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role]))[aria-invalid="true"] {
    --tw-ring-color: var(--color-destructive);
  }

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

  input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"], [role])):is(.dark *)[aria-invalid="true"] {
    --tw-ring-color: var(--color-destructive);
  }

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

  input[type="file"] {
    display: flex;
    height: calc(var(--spacing) * 9);
    min-width: calc(var(--spacing) * 0);
    appearance: none;
    border-radius: var(--radius-md);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-input);
    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);
    --tw-outline-style: none;
    outline-style: none;
    transition-property: transform, translate, scale, rotate;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-duration: .15s;
    --tw-ease: var(--ease-out);
    transition-duration: .15s;
    transition-timing-function: var(--ease-out);
    background-color: #0000;
    width: 100%;
  }

  input[type="file"] *::selection {
    background-color: var(--color-primary);
  }

  input[type="file"]::selection {
    background-color: var(--color-primary);
  }

  input[type="file"] *::selection {
    color: var(--color-primary-foreground);
  }

  input[type="file"]::selection {
    color: var(--color-primary-foreground);
  }

  input[type="file"]::-webkit-file-upload-button {
    display: inline-flex;
  }

  input[type="file"]::file-selector-button {
    display: inline-flex;
  }

  input[type="file"]::-webkit-file-upload-button {
    height: calc(var(--spacing) * 7);
  }

  input[type="file"]::file-selector-button {
    height: calc(var(--spacing) * 7);
  }

  input[type="file"]::-webkit-file-upload-button {
    border-style: var(--tw-border-style);
    border-width: 0;
  }

  input[type="file"]::file-selector-button {
    border-style: var(--tw-border-style);
    border-width: 0;
  }

  input[type="file"]::-webkit-file-upload-button {
    background-color: #0000;
  }

  input[type="file"]::file-selector-button {
    background-color: #0000;
  }

  input[type="file"]::-webkit-file-upload-button {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
  }

  input[type="file"]::file-selector-button {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
  }

  input[type="file"]::-webkit-file-upload-button {
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
  }

  input[type="file"]::file-selector-button {
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
  }

  input[type="file"]::-webkit-file-upload-button {
    color: var(--color-foreground);
  }

  input[type="file"]::file-selector-button {
    color: var(--color-foreground);
  }

  input[type="file"]::placeholder {
    color: var(--color-muted-foreground);
  }

  input[type="file"]:disabled {
    pointer-events: none;
  }

  input[type="file"]:disabled {
    cursor: not-allowed;
  }

  input[type="file"]:disabled {
    opacity: .5;
  }

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

  input[type="file"]:is(.dark *) {
    background-color: var(--color-input);
  }

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

  input[type="file"]:focus-visible {
    border-color: var(--color-ring);
  }

  input[type="file"]:focus-visible {
    --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);
  }

  input[type="file"]:focus-visible {
    --tw-ring-color: var(--color-ring);
  }

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

  input[type="file"][aria-invalid="true"] {
    border-color: var(--color-destructive);
  }

  input[type="file"][aria-invalid="true"] {
    --tw-ring-color: var(--color-destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    input[type="file"][aria-invalid="true"] {
      --tw-ring-color: color-mix(in oklab, var(--color-destructive) 20%, transparent);
    }
  }

  input[type="file"]:is(.dark *)[aria-invalid="true"] {
    --tw-ring-color: var(--color-destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    input[type="file"]:is(.dark *)[aria-invalid="true"] {
      --tw-ring-color: color-mix(in oklab, var(--color-destructive) 40%, transparent);
    }
  }

  input[type="file"]:active:not(:disabled) {
    --tw-translate-y: calc(var(--spacing) * .5);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  input[type="file"]::-webkit-file-upload-button {
    background-color: var(--color-secondary);
    padding-inline: calc(var(--spacing) * 3);
    height: 100%;
    margin-inline-end: calc(var(--spacing) * 4);
  }

  textarea {
    display: flex;
    field-sizing: content;
    min-height: calc(var(--spacing) * 16);
    border-radius: var(--radius-md);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-input);
    padding-inline: calc(var(--spacing) * 3);
    padding-block: calc(var(--spacing) * 2);
    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;
    outline-style: none;
    background-color: #0000;
    width: 100%;
  }

  textarea::placeholder {
    color: var(--color-muted-foreground);
  }

  textarea:focus-visible {
    border-color: var(--color-ring);
  }

  textarea:focus-visible {
    --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);
  }

  textarea:focus-visible {
    --tw-ring-color: var(--color-ring);
  }

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

  textarea:disabled {
    cursor: not-allowed;
  }

  textarea:disabled {
    opacity: .5;
  }

  textarea[aria-invalid="true"] {
    border-color: var(--color-destructive);
  }

  textarea[aria-invalid="true"] {
    --tw-ring-color: var(--color-destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    textarea[aria-invalid="true"] {
      --tw-ring-color: color-mix(in oklab, var(--color-destructive) 20%, transparent);
    }
  }

  @media (min-width: 48rem) {
    textarea {
      font-size: var(--text-sm);
      line-height: var(--tw-leading, var(--text-sm--line-height));
    }
  }

  textarea:is(.dark *) {
    background-color: var(--color-input);
  }

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

  textarea:is(.dark *)[aria-invalid="true"] {
    --tw-ring-color: var(--color-destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    textarea:is(.dark *)[aria-invalid="true"] {
      --tw-ring-color: color-mix(in oklab, var(--color-destructive) 40%, transparent);
    }
  }

  select {
    display: flex;
    height: calc(var(--spacing) * 9);
    appearance: none;
    justify-content: space-between;
    align-items:  center;
    gap: calc(var(--spacing) * 2);
    border-radius: var(--radius-md);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-input);
    padding-block: calc(var(--spacing) * 2);
    padding-right: calc(var(--spacing) * 9);
    padding-left: calc(var(--spacing) * 3);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    white-space: nowrap;
    --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;
    outline-style: none;
    background-color: #0000;
    background-image: var(--chevron-down-icon-50);
    background-position: right .75rem center;
    background-repeat: no-repeat;
    background-size: 1rem;
    width: 100%;
  }

  select:focus-visible {
    border-color: var(--color-ring);
  }

  select:focus-visible {
    --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);
  }

  select:focus-visible {
    --tw-ring-color: var(--color-ring);
  }

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

  select:disabled {
    cursor: not-allowed;
  }

  select:disabled {
    opacity: .5;
  }

  select[aria-invalid="true"] {
    border-color: var(--color-destructive);
  }

  select[aria-invalid="true"] {
    --tw-ring-color: var(--color-destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    select[aria-invalid="true"] {
      --tw-ring-color: color-mix(in oklab, var(--color-destructive) 20%, transparent);
    }
  }

  select:is(.dark *) {
    background-color: var(--color-input);
  }

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

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

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

  select:is(.dark *)[aria-invalid="true"] {
    --tw-ring-color: var(--color-destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    select:is(.dark *)[aria-invalid="true"] {
      --tw-ring-color: color-mix(in oklab, var(--color-destructive) 40%, transparent);
    }
  }

  select option {
    background-color: var(--color-popover);
    color: var(--color-popover-foreground);
  }

  select optgroup {
    background-color: var(--color-popover);
    color: var(--color-popover-foreground);
  }

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

  label:is(:where(.peer):disabled ~ *) {
    pointer-events: none;
  }

  label:is(:where(.peer):disabled ~ *) {
    opacity: .5;
  }

  label:has( + :-webkit-any(input, textarea, select)) {
    padding-bottom: calc(var(--spacing) * 2);
  }

  label:has( + :-moz-any(input, textarea, select)) {
    padding-bottom: calc(var(--spacing) * 2);
  }

  label:has( + :is(input, textarea, select)) {
    padding-bottom: calc(var(--spacing) * 2);
  }

  label:has( > :disabled) {
    pointer-events: none;
    opacity: .5;
  }

  label:has( + :disabled) {
    pointer-events: none;
    opacity: .5;
  }

  input[type="checkbox"]:not([role="switch"]) {
    appearance: none;
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-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);
    transition-property: 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;
    outline-style: none;
    border-radius: 4px;
    flex-shrink: 0;
    width: calc(var(--spacing) * 4) !important;
    height: calc(var(--spacing) * 4) !important;
  }

  input[type="checkbox"]:not([role="switch"]):checked {
    border-color: var(--color-primary);
  }

  input[type="checkbox"]:not([role="switch"]):checked {
    background-color: var(--color-primary);
  }

  input[type="checkbox"]:not([role="switch"]):focus-visible {
    border-color: var(--color-ring);
  }

  input[type="checkbox"]:not([role="switch"]):focus-visible {
    --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);
  }

  input[type="checkbox"]:not([role="switch"]):focus-visible {
    --tw-ring-color: var(--color-ring);
  }

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

  input[type="checkbox"]:not([role="switch"]):disabled {
    cursor: not-allowed;
  }

  input[type="checkbox"]:not([role="switch"]):disabled {
    opacity: .5;
  }

  input[type="checkbox"]:not([role="switch"])[aria-invalid="true"] {
    border-color: var(--color-destructive);
  }

  input[type="checkbox"]:not([role="switch"])[aria-invalid="true"] {
    --tw-ring-color: var(--color-destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    input[type="checkbox"]:not([role="switch"])[aria-invalid="true"] {
      --tw-ring-color: color-mix(in oklab, var(--color-destructive) 20%, transparent);
    }
  }

  input[type="checkbox"]:not([role="switch"]):is(.dark *) {
    background-color: var(--color-input);
  }

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

  input[type="checkbox"]:not([role="switch"]):is(.dark *):checked {
    background-color: var(--color-primary);
  }

  input[type="checkbox"]:not([role="switch"]):is(.dark *)[aria-invalid="true"] {
    --tw-ring-color: var(--color-destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    input[type="checkbox"]:not([role="switch"]):is(.dark *)[aria-invalid="true"] {
      --tw-ring-color: color-mix(in oklab, var(--color-destructive) 40%, transparent);
    }
  }

  input[type="checkbox"]:not([role="switch"]) + label {
    display: inline-flex;
  }

  input[type="checkbox"]:not([role="switch"]):checked:after {
    display: block;
    width: calc(var(--spacing) * 3.5);
    height: calc(var(--spacing) * 3.5);
    background-color: var(--color-primary-foreground);
    --tw-content: "";
    content: var(--tw-content);
    mask-image: var(--check-icon);
    mask-size: .875rem;
    mask-position: center;
    mask-repeat: no-repeat;
  }

  fieldset {
    display: flex;
    gap: calc(var(--spacing) * 4);
    border-radius: var(--radius-lg);
    border-style: var(--tw-border-style);
    padding: calc(var(--spacing) * 4);
    padding-bottom: calc(var(--spacing) * 5);
    border-width: 1px;
    flex-direction: column;
  }

  fieldset legend {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-leading: 1;
    --tw-font-weight: var(--font-weight-medium);
    line-height: 1;
    font-weight: var(--font-weight-medium);
    color: var(--color-muted-foreground);
    -webkit-user-select: none;
    user-select: none;
  }

  fieldset ul:has( > li) {
    display: contents;
    padding-inline-start: calc(var(--spacing) * 0) !important;
  }

  fieldset ul:has( > li) li {
    list-style-type: none;
  }

  fieldset > :last-child {
    margin-bottom: calc(var(--spacing) * 0) !important;
  }

  fieldset > p:has(input) {
    margin-bottom: calc(var(--spacing) * 0) !important;
  }

  div:has( > :-webkit-any(input[type="checkbox"], input[type="radio"]) + label) {
    display: flex;
    align-items:  center;
    gap: calc(var(--spacing) * 2);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-leading: 1;
    --tw-font-weight: var(--font-weight-medium);
    line-height: 1;
    font-weight: var(--font-weight-medium);
    -webkit-user-select: none;
    user-select: none;
  }

  div:has( > :is(input[type="checkbox"], input[type="radio"]) + label):is(:where(.peer):disabled ~ *) {
    pointer-events: none;
  }

  div:has( > :is(input[type="checkbox"], input[type="radio"]) + label):is(:where(.peer):disabled ~ *) {
    opacity: .5;
  }

  div:has( > :-moz-any(input[type="checkbox"], input[type="radio"]) + label) {
    display: flex;
    align-items:  center;
    gap: calc(var(--spacing) * 2);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-leading: 1;
    --tw-font-weight: var(--font-weight-medium);
    line-height: 1;
    font-weight: var(--font-weight-medium);
    -webkit-user-select: none;
    user-select: none;
  }

  div:has( > :is(input[type="checkbox"], input[type="radio"]) + label):is(:where(.peer):disabled ~ *) {
    pointer-events: none;
  }

  div:has( > :is(input[type="checkbox"], input[type="radio"]) + label):is(:where(.peer):disabled ~ *) {
    opacity: .5;
  }

  div:has( > :is(input[type="checkbox"], input[type="radio"]) + label) {
    display: flex;
    align-items:  center;
    gap: calc(var(--spacing) * 2);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-leading: 1;
    --tw-font-weight: var(--font-weight-medium);
    line-height: 1;
    font-weight: var(--font-weight-medium);
    -webkit-user-select: none;
    user-select: none;
  }

  div:has( > :is(input[type="checkbox"], input[type="radio"]) + label):is(:where(.peer):disabled ~ *) {
    pointer-events: none;
  }

  div:has( > :is(input[type="checkbox"], input[type="radio"]) + label):is(:where(.peer):disabled ~ *) {
    opacity: .5;
  }

  input[type="radio"] {
    position: relative;
    aspect-ratio: 1;
    appearance: none;
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-input);
    color: var(--color-primary);
    --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;
    outline-style: none;
    border-radius: 3.40282e38px;
    flex-shrink: 0;
    width: calc(var(--spacing) * 4) !important;
    height: calc(var(--spacing) * 4) !important;
  }

  input[type="radio"]:focus-visible {
    border-color: var(--color-ring);
  }

  input[type="radio"]:focus-visible {
    --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);
  }

  input[type="radio"]:focus-visible {
    --tw-ring-color: var(--color-ring);
  }

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

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

  input[type="radio"]:disabled {
    opacity: .5;
  }

  input[type="radio"][aria-invalid="true"] {
    border-color: var(--color-destructive);
  }

  input[type="radio"][aria-invalid="true"] {
    --tw-ring-color: var(--color-destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    input[type="radio"][aria-invalid="true"] {
      --tw-ring-color: color-mix(in oklab, var(--color-destructive) 20%, transparent);
    }
  }

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

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

  input[type="radio"]:is(.dark *)[aria-invalid="true"] {
    --tw-ring-color: var(--color-destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    input[type="radio"]:is(.dark *)[aria-invalid="true"] {
      --tw-ring-color: color-mix(in oklab, var(--color-destructive) 40%, transparent);
    }
  }

  input[type="radio"]:checked:before {
    position: absolute;
    width: calc(var(--spacing) * 2);
    height: calc(var(--spacing) * 2);
    --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);
    --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
    translate: var(--tw-translate-x) var(--tw-translate-y);
    background-color: var(--color-primary);
    --tw-content: "";
    content: var(--tw-content);
    border-radius: 3.40282e38px;
    top: 50%;
    left: 50%;
  }

  input {
    position: relative;
  }

  input::-webkit-calendar-picker-indicator {
    position: absolute;
    right: calc(var(--spacing) * 2);
    fill: var(--color-primary);
    color: var(--color-primary);
    background-image: var(--buncss-light, url("data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"lucide lucide-calendar\"><path d=\"M8 2v4\"></path><path d=\"M16 2v4\"></path><rect width=\"18\" height=\"18\" x=\"3\" y=\"4\" rx=\"2\"></rect><path d=\"M3 10h18\"></path></svg>")) var(--buncss-dark, url("data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"lucide lucide-calendar\"><path d=\"M8 2v4\"></path><path d=\"M16 2v4\"></path><rect width=\"18\" height=\"18\" x=\"3\" y=\"4\" rx=\"2\"></rect><path d=\"M3 10h18\"></path></svg>"));
  }

  input:-webkit-any([type="date"], [type="datetime-local"])::-webkit-datetime-edit-text {
    color: var(--color-muted-foreground);
  }

  input:-moz-any([type="date"], [type="datetime-local"])::-webkit-datetime-edit-text {
    color: var(--color-muted-foreground);
  }

  input:is([type="date"], [type="datetime-local"])::-webkit-datetime-edit-text {
    color: var(--color-muted-foreground);
  }

  input[type="checkbox"][role="switch"] {
    display: inline-flex;
    appearance: none;
    border-style: var(--tw-border-style);
    --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: 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;
    outline-style: none;
    background-color: var(--color-input);
    border-width: 1px;
    border-color: #0000;
    border-radius: 3.40282e38px;
    flex-shrink: 0;
    align-items:  center;
    height: 1.15rem;
    width: calc(var(--spacing) * 8) !important;
  }

  input[type="checkbox"][role="switch"]:focus-visible {
    border-color: var(--color-ring);
  }

  input[type="checkbox"][role="switch"]:focus-visible {
    --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);
  }

  input[type="checkbox"][role="switch"]:focus-visible {
    --tw-ring-color: var(--color-ring);
  }

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

  input[type="checkbox"][role="switch"]:disabled {
    cursor: not-allowed;
  }

  input[type="checkbox"][role="switch"]:disabled {
    opacity: .5;
  }

  input[type="checkbox"][role="switch"]:checked {
    background-color: var(--color-primary);
  }

  input[type="checkbox"][role="switch"]:is(.dark *) {
    background-color: var(--color-input);
  }

  @supports (color: color-mix(in lab, red, red)) {
    input[type="checkbox"][role="switch"]:is(.dark *) {
      background-color: color-mix(in oklab, var(--color-input) 80%, transparent);
    }
  }

  input[type="checkbox"][role="switch"]:is(.dark *):checked {
    background-color: var(--color-primary);
  }

  input[type="checkbox"][role="switch"]:before {
    content: var(--tw-content);
    pointer-events: none;
  }

  input[type="checkbox"][role="switch"]:before {
    content: var(--tw-content);
    display: block;
  }

  input[type="checkbox"][role="switch"]:before {
    content: var(--tw-content);
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
  }

  input[type="checkbox"][role="switch"]:before {
    content: var(--tw-content);
    border-radius: 3.40282e38px;
  }

  input[type="checkbox"][role="switch"]:before {
    content: var(--tw-content);
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(0px + 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);
  }

  input[type="checkbox"][role="switch"]:before {
    content: var(--tw-content);
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }

  input[type="checkbox"][role="switch"]:before {
    --tw-content: "";
    content: var(--tw-content);
  }

  input[type="checkbox"][role="switch"]:before {
    content: var(--tw-content);
    background-color: var(--color-background);
  }

  input[type="checkbox"][role="switch"]:is(.dark *):before {
    content: var(--tw-content);
    background-color: var(--color-foreground);
  }

  input[type="checkbox"][role="switch"]:checked:before {
    content: var(--tw-content);
    margin-inline-start: calc(var(--spacing) * 3.5);
  }

  input[type="checkbox"][role="switch"]:is(.dark *):checked:before {
    content: var(--tw-content);
    background-color: var(--color-primary-foreground);
  }

  input[type="color" i] {
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-border);
    transition-property: transform, translate, scale, rotate;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-duration: .15s;
    border-radius: 3.40282e38px;
    transition-duration: .15s;
    width: 30px !important;
    height: 30px !important;
  }

  input[type="color" i]:active {
    --tw-translate-y: calc(var(--spacing) * .5);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  input[type="color" i]::-webkit-color-swatch-wrapper {
    border-radius: 99px;
  }

  input[type="color" i]::-webkit-color-swatch {
    border-radius: 99px;
  }

  input[type="color" i]::-moz-color-swatch {
    border-radius: 99px;
  }

  input[type="color" i]::-webkit-color-swatch-wrapper {
    padding: calc(var(--spacing) * 1);
  }

  input[type="range"] {
    accent-color: var(--color-primary);
    width: 100%;
  }

  input[type="range"]:hover::-webkit-slider-thumb {
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  input[type="range"]:hover::-moz-range-thumb {
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  input[type="range"]:hover::-ms-thumb {
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  input[type="range"]:focus-visible::-webkit-slider-thumb {
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

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

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

  input[type="range"]::-ms-thumb {
    display: block;
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
    appearance: none;
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-primary);
    background-color: var(--color-background);
    --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);
    --tw-ring-color: var(--color-ring);
    border-radius: 3.40282e38px;
    flex-shrink: 0;
  }

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

  input[type="range"]::-webkit-slider-thumb {
    display: block;
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
    appearance: none;
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-primary);
    background-color: var(--color-background);
    --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);
    --tw-ring-color: var(--color-ring);
    border-radius: 3.40282e38px;
    flex-shrink: 0;
  }

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

  input[type="range"]::-moz-range-thumb {
    display: block;
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
    appearance: none;
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-primary);
    background-color: var(--color-background);
    --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);
    --tw-ring-color: var(--color-ring);
    border-radius: 3.40282e38px;
    flex-shrink: 0;
  }

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

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

  table thead tr {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
  }

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

  table tfoot {
    border-top-style: var(--tw-border-style);
    background-color: var(--color-muted);
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    border-top-width: 1px;
  }

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

  table tfoot > tr:last-child {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 0;
  }

  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) {
    table tr:hover {
      background-color: var(--color-muted);
    }

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

  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(--color-foreground);
  }

  table th:has([role="checkbox"]) {
    padding-right: calc(var(--spacing) * 0);
  }

  table th > [role="checkbox"] {
    --tw-translate-y: 2px;
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

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

  table td:has([role="checkbox"]) {
    padding-right: calc(var(--spacing) * 0);
  }

  table td > [role="checkbox"] {
    --tw-translate-y: 2px;
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  table caption {
    margin-top: calc(var(--spacing) * 4);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    color: var(--color-muted-foreground);
  }
}

@layer components {
  img[src] {
    border-radius: var(--radius-xl);
  }

  figure {
    width: -moz-fit-content;
    width: fit-content;
  }

  figure .caption {
    margin-top: calc(var(--spacing) * 3);
    text-align: center;
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    color: var(--color-muted-foreground);
  }

  figure figcaption {
    margin-top: calc(var(--spacing) * 3);
    text-align: center;
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    color: var(--color-muted-foreground);
  }
}

@layer components {
  [aria-busy="true"] {
    position: relative;
  }

  [aria-busy="true"]:not(:empty):after {
    position: absolute;
    inset: calc(var(--spacing) * 0);
    z-index: 1;
    margin: auto;
  }

  [aria-busy="true"][data-variant="overlay"] > * {
    opacity: .3;
    pointer-events: none;
  }

  [aria-busy="true"]:after {
    content: "";
    display: block;
    width: calc(var(--spacing) * 6);
    height: calc(var(--spacing) * 6);
    animation: var(--animate-spin);
    background-image: url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"lucide lucide-loader-circle-icon lucide-loader-circle\"><path d=\"M21 12a9 9 0 1 1-6.219-8.56\"/></svg>");
  }
}

@layer components {
  .item {
    display: flex;
    align-items:  center;
    gap: calc(var(--spacing) * 4);
    border-radius: var(--radius-md);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-border);
    padding: calc(var(--spacing) * 4);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-duration: .1s;
    --tw-outline-style: none;
    outline-style: none;
    flex-wrap: wrap;
    transition-duration: .1s;
  }

  .item:focus-visible {
    border-color: var(--color-ring);
  }

  .item:focus-visible {
    --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);
  }

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

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

  .item:-webkit-any(a[href]) {
    transition-property: transform, translate, scale, rotate;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-duration: .15s;
    --tw-ease: var(--ease-out);
    transition-duration: .15s;
    transition-timing-function: var(--ease-out);
    text-decoration-line: none !important;
  }

  @media (hover: hover) {
    .item:-webkit-any(a[href]):hover {
      background-color: var(--color-accent);
    }

    @supports (color: color-mix(in lab, red, red)) {
      .item:-webkit-any(a[href]):hover {
        background-color: color-mix(in oklab, var(--color-accent) 50%, transparent);
      }
    }
  }

  .item:-webkit-any(a[href]):active:not(:disabled) {
    --tw-translate-y: calc(var(--spacing) * .5);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  .item:-moz-any(a[href]) {
    transition-property: transform, translate, scale, rotate;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-duration: .15s;
    --tw-ease: var(--ease-out);
    transition-duration: .15s;
    transition-timing-function: var(--ease-out);
    text-decoration-line: none !important;
  }

  @media (hover: hover) {
    .item:-moz-any(a[href]):hover {
      background-color: var(--color-accent);
    }

    @supports (color: color-mix(in lab, red, red)) {
      .item:-moz-any(a[href]):hover {
        background-color: color-mix(in oklab, var(--color-accent) 50%, transparent);
      }
    }
  }

  .item:-moz-any(a[href]):active:not(:disabled) {
    --tw-translate-y: calc(var(--spacing) * .5);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  .item:is(a[href]) {
    transition-property: transform, translate, scale, rotate;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-duration: .15s;
    --tw-ease: var(--ease-out);
    transition-duration: .15s;
    transition-timing-function: var(--ease-out);
    text-decoration-line: none !important;
  }

  @media (hover: hover) {
    .item:is(a[href]):hover {
      background-color: var(--color-accent);
    }

    @supports (color: color-mix(in lab, red, red)) {
      .item:is(a[href]):hover {
        background-color: color-mix(in oklab, var(--color-accent) 50%, transparent);
      }
    }
  }

  .item:is(a[href]):active:not(:disabled) {
    --tw-translate-y: calc(var(--spacing) * .5);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  .item:has( > svg) {
    flex-wrap: nowrap;
  }

  .item > svg {
    color: var(--color-muted-foreground);
    flex-shrink: 0;
  }

  .item > :-webkit-any(div, section, article) {
    display: flex;
    justify-content: center;
    gap: calc(var(--spacing) * 0);
    flex-direction: column;
  }

  .item > :-webkit-any(div, section, article) > :-webkit-any(h1, h2, h3, h4, h5, h6) {
    margin: calc(var(--spacing) * 0) !important;
    font-size: var(--text-base) !important;
    line-height: var(--tw-leading, var(--text-base--line-height)) !important;
  }

  .item > :-moz-any(div, section, article) > :-moz-any(h1, h2, h3, h4, h5, h6) {
    margin: calc(var(--spacing) * 0) !important;
    font-size: var(--text-base) !important;
    line-height: var(--tw-leading, var(--text-base--line-height)) !important;
  }

  .item > :is(div, section, article) > :is(h1, h2, h3, h4, h5, h6) {
    margin: calc(var(--spacing) * 0) !important;
    font-size: var(--text-base) !important;
    line-height: var(--tw-leading, var(--text-base--line-height)) !important;
  }

  .item > :is(div, section, article) > p {
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    text-wrap: balance;
    color: var(--color-muted-foreground);
    -webkit-box-orient: vertical;
    margin: calc(var(--spacing) * 0) !important;
  }

  .item > :-moz-any(div, section, article) {
    display: flex;
    justify-content: center;
    gap: calc(var(--spacing) * 0);
    flex-direction: column;
  }

  .item > :-webkit-any(div, section, article) > :-webkit-any(h1, h2, h3, h4, h5, h6) {
    margin: calc(var(--spacing) * 0) !important;
    font-size: var(--text-base) !important;
    line-height: var(--tw-leading, var(--text-base--line-height)) !important;
  }

  .item > :-moz-any(div, section, article) > :-moz-any(h1, h2, h3, h4, h5, h6) {
    margin: calc(var(--spacing) * 0) !important;
    font-size: var(--text-base) !important;
    line-height: var(--tw-leading, var(--text-base--line-height)) !important;
  }

  .item > :is(div, section, article) > :is(h1, h2, h3, h4, h5, h6) {
    margin: calc(var(--spacing) * 0) !important;
    font-size: var(--text-base) !important;
    line-height: var(--tw-leading, var(--text-base--line-height)) !important;
  }

  .item > :is(div, section, article) > p {
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    text-wrap: balance;
    color: var(--color-muted-foreground);
    -webkit-box-orient: vertical;
    margin: calc(var(--spacing) * 0) !important;
  }

  .item > :is(div, section, article) {
    display: flex;
    justify-content: center;
    gap: calc(var(--spacing) * 0);
    flex-direction: column;
  }

  .item > :-webkit-any(div, section, article) > :-webkit-any(h1, h2, h3, h4, h5, h6) {
    margin: calc(var(--spacing) * 0) !important;
    font-size: var(--text-base) !important;
    line-height: var(--tw-leading, var(--text-base--line-height)) !important;
  }

  .item > :-moz-any(div, section, article) > :-moz-any(h1, h2, h3, h4, h5, h6) {
    margin: calc(var(--spacing) * 0) !important;
    font-size: var(--text-base) !important;
    line-height: var(--tw-leading, var(--text-base--line-height)) !important;
  }

  .item > :is(div, section, article) > :is(h1, h2, h3, h4, h5, h6) {
    margin: calc(var(--spacing) * 0) !important;
    font-size: var(--text-base) !important;
    line-height: var(--tw-leading, var(--text-base--line-height)) !important;
  }

  .item > :is(div, section, article) > p {
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    text-wrap: balance;
    color: var(--color-muted-foreground);
    -webkit-box-orient: vertical;
    margin: calc(var(--spacing) * 0) !important;
  }

  .item > :not(svg):has(h1, h2, h3, h4, h5, h6, p) {
    flex-grow: 1;
  }
}

@layer components {
  :root {
    --ease-out: cubic-bezier(.23, 1, .32, 1);
    --ease-in-out: cubic-bezier(.77, 0, .175, 1);
    --ease-drawer: cubic-bezier(.32, .72, 0, 1);
    interpolate-size: allow-keywords;
  }

  summary {
    list-style: none;
  }

  summary::-webkit-details-marker {
    display: none;
  }

  details {
    gap: calc(var(--spacing) * 4);
    border-radius: var(--radius-md);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-border);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-duration: .1s;
    --tw-outline-style: none;
    outline-style: none;
    transition-property: transform, translate, scale, rotate;
    transition-duration: .1s;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-duration: .15s;
    --tw-ease: var(--ease-out);
    transition-duration: .15s;
    transition-timing-function: var(--ease-out);
  }

  details:focus-visible {
    border-color: var(--color-ring);
  }

  details:focus-visible {
    --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);
  }

  details:focus-visible {
    --tw-ring-color: var(--color-ring);
  }

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

  @media (hover: hover) {
    details:hover {
      background-color: var(--color-accent);
    }

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

  details:active:not(:disabled) {
    --tw-translate-y: calc(var(--spacing) * .5);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  details > summary {
    padding: calc(var(--spacing) * 4);
    font-size: var(--text-base) !important;
    line-height: var(--tw-leading, var(--text-base--line-height)) !important;
    --tw-leading: 1 !important;
    --tw-font-weight: var(--font-weight-medium) !important;
    line-height: 1 !important;
    font-weight: var(--font-weight-medium) !important;
  }

  details:has( + details) {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 0;
    border-radius: 0;
  }

  details:not(:has( + details)) {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    border-bottom-right-radius: var(--radius-md);
    border-bottom-left-radius: var(--radius-md);
  }

  details:has( + details):first-of-type {
    border-top-left-radius: var(--radius-md);
    border-top-right-radius: var(--radius-md);
  }

  details:not([open])::details-content {
    overflow: hidden;
    opacity: 0;
    content-visibility: visible;
    height: 0;
  }

  details > :not(summary) {
    padding: calc(var(--spacing) * 4) !important;
    padding-top: calc(var(--spacing) * 0) !important;
  }

  @media (hover: hover) {
    details:hover {
      cursor: pointer;
    }
  }

  details::details-content {
    transition-timing-function: var(--ease-out);
    transition-behavior: allow-discrete;
    transition: opacity .2s, height .2s;
  }

  details :-webkit-any(h2, h3, h4, h5, h6, p) {
    padding: calc(var(--spacing) * 0);
    margin-bottom: calc(var(--spacing) * 0) !important;
  }

  details :-moz-any(h2, h3, h4, h5, h6, p) {
    padding: calc(var(--spacing) * 0);
    margin-bottom: calc(var(--spacing) * 0) !important;
  }

  details :is(h2, h3, h4, h5, h6, p) {
    padding: calc(var(--spacing) * 0);
    margin-bottom: calc(var(--spacing) * 0) !important;
  }

  details summary > * {
    margin: calc(var(--spacing) * 0) !important;
    padding: calc(var(--spacing) * 0) !important;
  }

  details summary > :-webkit-any(h2, h3, h4, h5, h6, p, span) {
    font-size: var(--text-base) !important;
    line-height: var(--tw-leading, var(--text-base--line-height)) !important;
    --tw-leading: 1 !important;
    --tw-font-weight: var(--font-weight-medium) !important;
    line-height: 1 !important;
    font-weight: var(--font-weight-medium) !important;
  }

  details summary > :-moz-any(h2, h3, h4, h5, h6, p, span) {
    font-size: var(--text-base) !important;
    line-height: var(--tw-leading, var(--text-base--line-height)) !important;
    --tw-leading: 1 !important;
    --tw-font-weight: var(--font-weight-medium) !important;
    line-height: 1 !important;
    font-weight: var(--font-weight-medium) !important;
  }

  details summary > :is(h2, h3, h4, h5, h6, p, span) {
    font-size: var(--text-base) !important;
    line-height: var(--tw-leading, var(--text-base--line-height)) !important;
    --tw-leading: 1 !important;
    --tw-font-weight: var(--font-weight-medium) !important;
    line-height: 1 !important;
    font-weight: var(--font-weight-medium) !important;
  }

  details[open]::details-content {
    content-visibility: visible;
    opacity: 1;
    height: calc-size(auto, size);
  }
}

@layer utilities {
  :root {
    --container-width: 640px;
  }

  .page, .container {
    max-width: var(--container-width);
    width: 100%;
    margin-inline-start: auto;
    margin-inline-end: auto;
  }

  @media (max-width: calc(40rem - .001px)) {
    :is(.page, .container) {
      padding: calc(var(--spacing) * 4);
    }
  }

  @media (min-width: 40rem) {
    :is(.page, .container) {
      padding: calc(var(--spacing) * 6);
    }
  }

  .section {
    margin-bottom: calc(var(--spacing) * 8);
  }

  .y-stack {
    display: flex;
    gap: calc(var(--spacing) * 4);
    flex-direction: column;
    height: auto;
  }

  .y-stack > :-webkit-any(h1, h2, h3, h4, h5, h6, p) {
    margin: calc(var(--spacing) * 0) !important;
  }

  .y-stack > :-moz-any(h1, h2, h3, h4, h5, h6, p) {
    margin: calc(var(--spacing) * 0) !important;
  }

  .y-stack > :is(h1, h2, h3, h4, h5, h6, p) {
    margin: calc(var(--spacing) * 0) !important;
  }

  .x-stack {
    display: flex;
    align-items:  center;
    gap: calc(var(--spacing) * 3);
  }

  .x-stack > :-webkit-any(h1, h2, h3, h4, h5, h6, p) {
    margin: calc(var(--spacing) * 0) !important;
  }

  .x-stack > :-moz-any(h1, h2, h3, h4, h5, h6, p) {
    margin: calc(var(--spacing) * 0) !important;
  }

  .x-stack > :is(h1, h2, h3, h4, h5, h6, p) {
    margin: calc(var(--spacing) * 0) !important;
  }
}

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

@property --tw-outline-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-duration {
  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-ease {
  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-content {
  syntax: "*";
  inherits: false;
  initial-value: "";
}

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

@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-outline-style: solid;
      --tw-leading: initial;
      --tw-font-weight: initial;
      --tw-tracking: initial;
      --tw-duration: initial;
      --tw-translate-x: 0;
      --tw-translate-y: 0;
      --tw-translate-z: 0;
      --tw-ease: 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-content: "";
    }
  }
}