/*! tailwindcss v4.3.0 | 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-black: #000;
    --spacing: 0.25rem;
    --container-xs: 20rem;
    --container-md: 28rem;
    --container-xl: 36rem;
    --container-2xl: 42rem;
    --container-3xl: 48rem;
    --container-4xl: 56rem;
    --container-5xl: 64rem;
    --container-6xl: 72rem;
    --text-xs: 0.75rem;
    --text-xs--line-height: calc(1 / 0.75);
    --text-sm: 0.875rem;
    --text-sm--line-height: calc(1.25 / 0.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);
    --text-4xl: 2.25rem;
    --text-4xl--line-height: calc(2.5 / 2.25);
    --text-5xl: 3rem;
    --text-5xl--line-height: 1;
    --text-6xl: 3.75rem;
    --text-6xl--line-height: 1;
    --text-7xl: 4.5rem;
    --text-7xl--line-height: 1;
    --font-weight-light: 300;
    --font-weight-normal: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
    --tracking-tight: -0.025em;
    --tracking-wider: 0.05em;
    --tracking-widest: 0.1em;
    --leading-tight: 1.25;
    --leading-snug: 1.375;
    --leading-normal: 1.5;
    --leading-relaxed: 1.625;
    --radius-sm: 0.25rem;
    --radius-md: 0.375rem;
    --radius-lg: 0.75rem;
    --radius-xl: 0.75rem;
    --radius-2xl: 1rem;
    --radius-3xl: 1.5rem;
    --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
    --shadow-xl: 0 25px 50px -12px rgb(0 0 0 / 0.6);
    --ease-out: cubic-bezier(0, 0, 0.2, 1);
    --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
    --blur-sm: 8px;
    --blur-md: 12px;
    --blur-2xl: 40px;
    --aspect-video: 16 / 9;
    --default-transition-duration: 150ms;
    --default-transition-timing-function: var(--ease-ui);
    --default-font-family: var(--font-sans);
    --default-mono-font-family: var(--font-mono);
    --shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
    --radius: 0.5rem;
    --color-surface: #ffffff;
    --color-surface-secondary: #f5f5f5;
    --color-on-surface: #171717;
    --color-on-surface-secondary: #b9a8c6;
    --color-border: #3b2e49;
    --color-accent: #2563eb;
    --color-interactive: #171717;
    --color-interactive-text: #ffffff;
    --color-button-primary: var(--color-interactive);
    --color-button-primary-text: var(--color-interactive-text);
    --color-button-secondary: var(--color-border);
    --color-button-secondary-text: var(--color-on-surface);
    --color-button-outline-border: var(--color-interactive);
    --color-button-outline-text: var(--color-interactive);
    --color-sale: #ff6b81;
    --color-compare: #a596b3;
    --color-success: #059669;
    --color-warning: #d97706;
    --color-warning-text: #171717;
    --color-critical: #ff6b81;
    --color-info: #2563eb;
    --color-overlay: rgb(0 0 0 / 0.95);
    --color-overlay-strong: rgb(0 0 0 / 0.7);
    --color-overlay-subtle: rgb(0 0 0 / 0.5);
    --radius-button: 0.5rem;
    --radius-card: 0;
    --radius-input: 0.5rem;
    --font-body: system-ui, -apple-system, sans-serif;
    --font-heading: system-ui, -apple-system, sans-serif;
    --ease-ui: cubic-bezier(0.16, 1, 0.3, 1);
    --ease-drawer: cubic-bezier(0.32, 0.72, 0, 1);
    --spacing-page: 80rem;
    --spacing-margin: max(1rem, var(--safe-area-inset-inline));
    --spacing-touch-target: 2.75rem;
    --spacing-dialog-max-height: 85dvh;
    --spacing-hero: 60dvh;
    --spacing-drawer-width: 480px;
    --spacing-notification-width: min(
    400px,
    calc(100vw - max(1.5rem, var(--safe-area-inset-inline)) - max(1.5rem, var(--safe-area-inset-inline)))
  );
    --aspect-landscape: 16/9;
  }
}
@layer base {
  *, ::after, ::before, ::backdrop, ::file-selector-button {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    border: 0 solid;
  }
  html, :host {
    line-height: 1.5;
    -webkit-text-size-adjust: 100%;
    tab-size: 4;
    font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
    font-feature-settings: var(--default-font-feature-settings, normal);
    font-variation-settings: var(--default-font-variation-settings, normal);
    -webkit-tap-highlight-color: transparent;
  }
  hr {
    height: 0;
    color: inherit;
    border-top-width: 1px;
  }
  abbr:where([title]) {
    -webkit-text-decoration: underline dotted;
    text-decoration: underline dotted;
  }
  h1, h2, h3, h4, h5, h6 {
    font-size: inherit;
    font-weight: inherit;
  }
  a {
    color: inherit;
    -webkit-text-decoration: inherit;
    text-decoration: inherit;
  }
  b, strong {
    font-weight: bolder;
  }
  code, kbd, samp, pre {
    font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
    font-feature-settings: var(--default-mono-font-feature-settings, normal);
    font-variation-settings: var(--default-mono-font-variation-settings, normal);
    font-size: 1em;
  }
  small {
    font-size: 80%;
  }
  sub, sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
  }
  sub {
    bottom: -0.25em;
  }
  sup {
    top: -0.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, ::file-selector-button {
    font: inherit;
    font-feature-settings: inherit;
    font-variation-settings: inherit;
    letter-spacing: inherit;
    color: inherit;
    border-radius: 0;
    background-color: transparent;
    opacity: 1;
  }
  :where(select:is([multiple], [size])) optgroup {
    font-weight: bolder;
  }
  :where(select:is([multiple], [size])) optgroup option {
    padding-inline-start: 20px;
  }
  ::file-selector-button {
    margin-inline-end: 4px;
  }
  ::placeholder {
    opacity: 1;
  }
  @supports (not (-webkit-appearance: -apple-pay-button))  or (contain-intrinsic-size: 1px) {
    ::placeholder {
      color: currentcolor;
      @supports (color: color-mix(in lab, red, red)) {
        color: color-mix(in oklab, currentcolor 50%, transparent);
      }
    }
  }
  textarea {
    resize: vertical;
  }
  ::-webkit-search-decoration {
    -webkit-appearance: none;
  }
  ::-webkit-date-and-time-value {
    min-height: 1lh;
    text-align: inherit;
  }
  ::-webkit-datetime-edit {
    display: inline-flex;
  }
  ::-webkit-datetime-edit-fields-wrapper {
    padding: 0;
  }
  ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month-field, ::-webkit-datetime-edit-day-field, ::-webkit-datetime-edit-hour-field, ::-webkit-datetime-edit-minute-field, ::-webkit-datetime-edit-second-field, ::-webkit-datetime-edit-millisecond-field, ::-webkit-datetime-edit-meridiem-field {
    padding-block: 0;
  }
  ::-webkit-calendar-picker-indicator {
    line-height: 1;
  }
  :-moz-ui-invalid {
    box-shadow: none;
  }
  button, input:where([type="button"], [type="reset"], [type="submit"]), ::file-selector-button {
    appearance: button;
  }
  ::-webkit-inner-spin-button, ::-webkit-outer-spin-button {
    height: auto;
  }
  [hidden]:where(:not([hidden="until-found"])) {
    display: none !important;
  }
}
@layer utilities {
  .\[container-type\:inline-size\] {
    container-type: inline-size;
  }
  .pointer-events-auto {
    pointer-events: auto;
  }
  .pointer-events-none {
    pointer-events: none;
  }
  .collapse {
    visibility: collapse;
  }
  .invisible {
    visibility: hidden;
  }
  .visible {
    visibility: visible;
  }
  .sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
    border-width: 0;
  }
  .not-sr-only {
    position: static;
    width: auto;
    height: auto;
    padding: 0;
    margin: 0;
    overflow: visible;
    clip-path: none;
    white-space: normal;
  }
  .absolute {
    position: absolute;
  }
  .fixed {
    position: fixed;
  }
  .relative {
    position: relative;
  }
  .static {
    position: static;
  }
  .sticky {
    position: sticky;
  }
  .-inset-\[30\%\] {
    inset: calc(30% * -1);
  }
  .inset-0 {
    inset: calc(var(--spacing) * 0);
  }
  .inset-\[4\%\] {
    inset: 4%;
  }
  .inset-x-0 {
    inset-inline: calc(var(--spacing) * 0);
  }
  .inset-x-2 {
    inset-inline: calc(var(--spacing) * 2);
  }
  .inset-x-3 {
    inset-inline: calc(var(--spacing) * 3);
  }
  .inset-y-0 {
    inset-block: calc(var(--spacing) * 0);
  }
  .inset-y-1 {
    inset-block: calc(var(--spacing) * 1);
  }
  .inset-s-0 {
    inset-inline-start: calc(var(--spacing) * 0);
  }
  .inset-s-\[27\%\] {
    inset-inline-start: 27%;
  }
  .inset-s-auto {
    inset-inline-start: auto;
  }
  .start-0 {
    inset-inline-start: calc(var(--spacing) * 0);
  }
  .start-6 {
    inset-inline-start: calc(var(--spacing) * 6);
  }
  .start-\[-9999px\] {
    inset-inline-start: -9999px;
  }
  .end-0 {
    inset-inline-end: calc(var(--spacing) * 0);
  }
  .end-1 {
    inset-inline-end: calc(var(--spacing) * 1);
  }
  .end-3 {
    inset-inline-end: calc(var(--spacing) * 3);
  }
  .inset-e-0 {
    inset-inline-end: calc(var(--spacing) * 0);
  }
  .inset-e-2 {
    inset-inline-end: calc(var(--spacing) * 2);
  }
  .inset-e-3 {
    inset-inline-end: calc(var(--spacing) * 3);
  }
  .inset-e-\[calc\(2\.25rem\+16px\)\] {
    inset-inline-end: calc(2.25rem + 16px);
  }
  .inset-e-\[max\(1\.5rem\,var\(--safe-area-inset-inline-end\)\)\] {
    inset-inline-end: max(1.5rem, var(--safe-area-inset-inline-end));
  }
  .inset-e-\[max\(1rem\,var\(--safe-area-inset-inline-end\)\)\] {
    inset-inline-end: max(1rem, var(--safe-area-inset-inline-end));
  }
  .inset-e-auto {
    inset-inline-end: auto;
  }
  .inset-bs-\[max\(1rem\,var\(--safe-area-inset-top\)\)\] {
    inset-block-start: max(1rem, var(--safe-area-inset-top));
  }
  .inset-bs-auto {
    inset-block-start: auto;
  }
  .inset-be-0 {
    inset-block-end: calc(var(--spacing) * 0);
  }
  .inset-be-\[max\(1\.5rem\,var\(--safe-area-inset-bottom\)\)\] {
    inset-block-end: max(1.5rem, var(--safe-area-inset-bottom));
  }
  .top-0 {
    top: calc(var(--spacing) * 0);
  }
  .top-1 {
    top: calc(var(--spacing) * 1);
  }
  .top-1\/2 {
    top: calc(1 / 2 * 100%);
  }
  .top-3 {
    top: calc(var(--spacing) * 3);
  }
  .top-4 {
    top: calc(var(--spacing) * 4);
  }
  .top-8 {
    top: calc(var(--spacing) * 8);
  }
  .top-10 {
    top: calc(var(--spacing) * 10);
  }
  .top-24 {
    top: calc(var(--spacing) * 24);
  }
  .top-\[68\%\] {
    top: 68%;
  }
  .top-auto {
    top: auto;
  }
  .top-full {
    top: 100%;
  }
  .-bottom-1 {
    bottom: calc(var(--spacing) * -1);
  }
  .-bottom-1\.5 {
    bottom: calc(var(--spacing) * -1.5);
  }
  .bottom-0 {
    bottom: calc(var(--spacing) * 0);
  }
  .bottom-2 {
    bottom: calc(var(--spacing) * 2);
  }
  .bottom-3 {
    bottom: calc(var(--spacing) * 3);
  }
  .bottom-6 {
    bottom: calc(var(--spacing) * 6);
  }
  .left-1 {
    left: calc(var(--spacing) * 1);
  }
  .left-1\/2 {
    left: calc(1 / 2 * 100%);
  }
  .isolate {
    isolation: isolate;
  }
  .-z-10 {
    z-index: calc(10 * -1);
  }
  .z-10 {
    z-index: 10;
  }
  .z-20 {
    z-index: 20;
  }
  .z-40 {
    z-index: 40;
  }
  .z-50 {
    z-index: 50;
  }
  .order-1 {
    order: 1;
  }
  .order-2 {
    order: 2;
  }
  .col-span-2 {
    grid-column: span 2 / span 2;
  }
  .col-span-3 {
    grid-column: span 3 / span 3;
  }
  .col-span-full {
    grid-column: 1 / -1;
  }
  .container {
    width: 100%;
    @media (width >= 40rem) {
      max-width: 40rem;
    }
    @media (width >= 48rem) {
      max-width: 48rem;
    }
    @media (width >= 64rem) {
      max-width: 64rem;
    }
    @media (width >= 80rem) {
      max-width: 80rem;
    }
    @media (width >= 96rem) {
      max-width: 96rem;
    }
  }
  .m-0 {
    margin: calc(var(--spacing) * 0);
  }
  .m-auto {
    margin: auto;
  }
  .-mx-2 {
    margin-inline: calc(var(--spacing) * -2);
  }
  .-mx-margin {
    margin-inline: calc(var(--spacing-margin) * -1);
  }
  .mx-0 {
    margin-inline: calc(var(--spacing) * 0);
  }
  .mx-8 {
    margin-inline: calc(var(--spacing) * 8);
  }
  .mx-\[calc\(-1\*var\(--spacing-margin\)-max\(0px\,\(100vw-var\(--spacing-page\)\)\/2\)\)\] {
    margin-inline: calc(-1 * var(--spacing-margin) - max(0px, (100vw - var(--spacing-page)) / 2));
  }
  .mx-auto {
    margin-inline: auto;
  }
  .my-4 {
    margin-block: calc(var(--spacing) * 4);
  }
  .my-6 {
    margin-block: calc(var(--spacing) * 6);
  }
  .my-8 {
    margin-block: calc(var(--spacing) * 8);
  }
  .my-12 {
    margin-block: calc(var(--spacing) * 12);
  }
  .my-auto {
    margin-block: auto;
  }
  .\[margin-inline-start\:-0\.025em\] {
    margin-inline-start: -0.025em;
  }
  .ms-0 {
    margin-inline-start: calc(var(--spacing) * 0);
  }
  .ms-0\.5 {
    margin-inline-start: calc(var(--spacing) * 0.5);
  }
  .ms-4 {
    margin-inline-start: calc(var(--spacing) * 4);
  }
  .ms-\[min\(0px\,calc\(var\(--safe-area-inset-inline\)-0\.5rem\)\)\] {
    margin-inline-start: min(0px, calc(var(--safe-area-inset-inline) - 0.5rem));
  }
  .ms-auto {
    margin-inline-start: auto;
  }
  .me-1 {
    margin-inline-end: calc(var(--spacing) * 1);
  }
  .me-2 {
    margin-inline-end: calc(var(--spacing) * 2);
  }
  .-mt-4 {
    margin-top: calc(var(--spacing) * -4);
  }
  .mt-0 {
    margin-top: calc(var(--spacing) * 0);
  }
  .mt-0\.5 {
    margin-top: calc(var(--spacing) * 0.5);
  }
  .mt-1 {
    margin-top: calc(var(--spacing) * 1);
  }
  .mt-1\.5 {
    margin-top: calc(var(--spacing) * 1.5);
  }
  .mt-2 {
    margin-top: calc(var(--spacing) * 2);
  }
  .mt-3 {
    margin-top: calc(var(--spacing) * 3);
  }
  .mt-4 {
    margin-top: calc(var(--spacing) * 4);
  }
  .mt-6 {
    margin-top: calc(var(--spacing) * 6);
  }
  .mt-7 {
    margin-top: calc(var(--spacing) * 7);
  }
  .mt-8 {
    margin-top: calc(var(--spacing) * 8);
  }
  .mt-10 {
    margin-top: calc(var(--spacing) * 10);
  }
  .mt-12 {
    margin-top: calc(var(--spacing) * 12);
  }
  .mb-0 {
    margin-bottom: calc(var(--spacing) * 0);
  }
  .mb-1 {
    margin-bottom: calc(var(--spacing) * 1);
  }
  .mb-2 {
    margin-bottom: calc(var(--spacing) * 2);
  }
  .mb-3 {
    margin-bottom: calc(var(--spacing) * 3);
  }
  .mb-4 {
    margin-bottom: calc(var(--spacing) * 4);
  }
  .mb-5 {
    margin-bottom: calc(var(--spacing) * 5);
  }
  .mb-6 {
    margin-bottom: calc(var(--spacing) * 6);
  }
  .mb-7 {
    margin-bottom: calc(var(--spacing) * 7);
  }
  .mb-8 {
    margin-bottom: calc(var(--spacing) * 8);
  }
  .mb-10 {
    margin-bottom: calc(var(--spacing) * 10);
  }
  .mb-16 {
    margin-bottom: calc(var(--spacing) * 16);
  }
  .box-border {
    box-sizing: border-box;
  }
  .line-clamp-1 {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
  }
  .line-clamp-2 {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }
  .line-clamp-3 {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
  }
  .line-clamp-4 {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
  }
  .block {
    display: block;
  }
  .contents {
    display: contents;
  }
  .flex {
    display: flex;
  }
  .grid {
    display: grid;
  }
  .hidden {
    display: none;
  }
  .inline {
    display: inline;
  }
  .inline-block {
    display: inline-block;
  }
  .inline-flex {
    display: inline-flex;
  }
  .inline-grid {
    display: inline-grid;
  }
  .table {
    display: table;
  }
  .aspect-3\/4 {
    aspect-ratio: 3/4;
  }
  .aspect-4\/3 {
    aspect-ratio: 4/3;
  }
  .aspect-\[3\/4\] {
    aspect-ratio: 3/4;
  }
  .aspect-\[4\/3\] {
    aspect-ratio: 4/3;
  }
  .aspect-\[5\/7\] {
    aspect-ratio: 5/7;
  }
  .aspect-auto {
    aspect-ratio: auto;
  }
  .aspect-landscape {
    aspect-ratio: var(--aspect-landscape);
  }
  .aspect-square {
    aspect-ratio: 1 / 1;
  }
  .aspect-video {
    aspect-ratio: var(--aspect-video);
  }
  .size-0 {
    width: calc(var(--spacing) * 0);
    height: calc(var(--spacing) * 0);
  }
  .size-1 {
    width: calc(var(--spacing) * 1);
    height: calc(var(--spacing) * 1);
  }
  .size-1\.5 {
    width: calc(var(--spacing) * 1.5);
    height: calc(var(--spacing) * 1.5);
  }
  .size-2 {
    width: calc(var(--spacing) * 2);
    height: calc(var(--spacing) * 2);
  }
  .size-2\.5 {
    width: calc(var(--spacing) * 2.5);
    height: calc(var(--spacing) * 2.5);
  }
  .size-3 {
    width: calc(var(--spacing) * 3);
    height: calc(var(--spacing) * 3);
  }
  .size-3\.5 {
    width: calc(var(--spacing) * 3.5);
    height: calc(var(--spacing) * 3.5);
  }
  .size-4 {
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
  }
  .size-5 {
    width: calc(var(--spacing) * 5);
    height: calc(var(--spacing) * 5);
  }
  .size-5\.5 {
    width: calc(var(--spacing) * 5.5);
    height: calc(var(--spacing) * 5.5);
  }
  .size-6 {
    width: calc(var(--spacing) * 6);
    height: calc(var(--spacing) * 6);
  }
  .size-9 {
    width: calc(var(--spacing) * 9);
    height: calc(var(--spacing) * 9);
  }
  .size-11 {
    width: calc(var(--spacing) * 11);
    height: calc(var(--spacing) * 11);
  }
  .size-16 {
    width: calc(var(--spacing) * 16);
    height: calc(var(--spacing) * 16);
  }
  .size-\[1em\] {
    width: 1em;
    height: 1em;
  }
  .size-full {
    width: 100%;
    height: 100%;
  }
  .size-touch-target {
    width: var(--spacing-touch-target);
    height: var(--spacing-touch-target);
  }
  .h-3 {
    height: calc(var(--spacing) * 3);
  }
  .h-5 {
    height: calc(var(--spacing) * 5);
  }
  .h-6 {
    height: calc(var(--spacing) * 6);
  }
  .h-8 {
    height: calc(var(--spacing) * 8);
  }
  .h-9 {
    height: calc(var(--spacing) * 9);
  }
  .h-10 {
    height: calc(var(--spacing) * 10);
  }
  .h-11 {
    height: calc(var(--spacing) * 11);
  }
  .h-12 {
    height: calc(var(--spacing) * 12);
  }
  .h-16 {
    height: calc(var(--spacing) * 16);
  }
  .h-18 {
    height: calc(var(--spacing) * 18);
  }
  .h-\[7\%\] {
    height: 7%;
  }
  .h-\[77px\] {
    height: 77px;
  }
  .h-auto {
    height: auto;
  }
  .h-dvh {
    height: 100dvh;
  }
  .h-full {
    height: 100%;
  }
  .max-h-8 {
    max-height: calc(var(--spacing) * 8);
  }
  .max-h-14 {
    max-height: calc(var(--spacing) * 14);
  }
  .max-h-82 {
    max-height: calc(var(--spacing) * 82);
  }
  .max-h-dialog-max-height {
    max-height: var(--spacing-dialog-max-height);
  }
  .min-h-0 {
    min-height: calc(var(--spacing) * 0);
  }
  .min-h-6 {
    min-height: calc(var(--spacing) * 6);
  }
  .min-h-8 {
    min-height: calc(var(--spacing) * 8);
  }
  .min-h-12 {
    min-height: calc(var(--spacing) * 12);
  }
  .min-h-14 {
    min-height: calc(var(--spacing) * 14);
  }
  .min-h-16 {
    min-height: calc(var(--spacing) * 16);
  }
  .min-h-\[42svh\] {
    min-height: 42svh;
  }
  .min-h-\[50px\] {
    min-height: 50px;
  }
  .min-h-\[52px\] {
    min-height: 52px;
  }
  .min-h-\[70svh\] {
    min-height: 70svh;
  }
  .min-h-\[72svh\] {
    min-height: 72svh;
  }
  .min-h-\[80svh\] {
    min-height: 80svh;
  }
  .min-h-\[clamp\(12rem\,55vw\,20rem\)\] {
    min-height: clamp(12rem, 55vw, 20rem);
  }
  .min-h-full {
    min-height: 100%;
  }
  .min-h-hero {
    min-height: var(--spacing-hero);
  }
  .min-h-svh {
    min-height: 100svh;
  }
  .min-h-touch-target {
    min-height: var(--spacing-touch-target);
  }
  .w-1 {
    width: calc(var(--spacing) * 1);
  }
  .w-5 {
    width: calc(var(--spacing) * 5);
  }
  .w-6 {
    width: calc(var(--spacing) * 6);
  }
  .w-8 {
    width: calc(var(--spacing) * 8);
  }
  .w-10 {
    width: calc(var(--spacing) * 10);
  }
  .w-12 {
    width: calc(var(--spacing) * 12);
  }
  .w-16 {
    width: calc(var(--spacing) * 16);
  }
  .w-24 {
    width: calc(var(--spacing) * 24);
  }
  .w-32 {
    width: calc(var(--spacing) * 32);
  }
  .w-48 {
    width: calc(var(--spacing) * 48);
  }
  .w-\[48\%\] {
    width: 48%;
  }
  .w-\[68px\] {
    width: 68px;
  }
  .w-\[72\%\] {
    width: 72%;
  }
  .w-\[88\%\] {
    width: 88%;
  }
  .w-\[calc\(100\%\+2\*var\(--spacing-margin\)\+max\(0px\,100vw-var\(--spacing-page\)\)\)\] {
    width: calc(100% + 2 * var(--spacing-margin) + max(0px, 100vw - var(--spacing-page)));
  }
  .w-\[min\(22rem\,calc\(100vw-2rem\)\)\] {
    width: min(22rem, calc(100vw - 2rem));
  }
  .w-\[min\(100\%\,1500px\)\] {
    width: min(100%, 1500px);
  }
  .w-\[min\(560px\,90vw\,calc\(100vw-var\(--safe-area-inset-inline\)-var\(--safe-area-inset-inline\)\)\)\] {
    width: min(560px, 90vw, calc(100vw - var(--safe-area-inset-inline) - var(--safe-area-inset-inline)));
  }
  .w-\[min\(720px\,90vw\,calc\(100vw-var\(--safe-area-inset-inline\)-var\(--safe-area-inset-inline\)\)\)\] {
    width: min(720px, 90vw, calc(100vw - var(--safe-area-inset-inline) - var(--safe-area-inset-inline)));
  }
  .w-auto {
    width: auto;
  }
  .w-drawer-width {
    width: var(--spacing-drawer-width);
  }
  .w-full {
    width: 100%;
  }
  .w-notification-width {
    width: var(--spacing-notification-width);
  }
  .w-px {
    width: 1px;
  }
  .w-screen {
    width: 100vw;
  }
  .max-w-2xl {
    max-width: var(--container-2xl);
  }
  .max-w-3xl {
    max-width: var(--container-3xl);
  }
  .max-w-4xl {
    max-width: var(--container-4xl);
  }
  .max-w-5xl {
    max-width: var(--container-5xl);
  }
  .max-w-6xl {
    max-width: var(--container-6xl);
  }
  .max-w-155 {
    max-width: calc(var(--spacing) * 155);
  }
  .max-w-\[13ch\] {
    max-width: 13ch;
  }
  .max-w-\[24ch\] {
    max-width: 24ch;
  }
  .max-w-\[35\%\] {
    max-width: 35%;
  }
  .max-w-\[38rem\] {
    max-width: 38rem;
  }
  .max-w-\[44ch\] {
    max-width: 44ch;
  }
  .max-w-\[48rem\] {
    max-width: 48rem;
  }
  .max-w-\[calc\(100\%-3rem\)\] {
    max-width: calc(100% - 3rem);
  }
  .max-w-\[min\(100\%\,110rem\)\] {
    max-width: min(100%, 110rem);
  }
  .max-w-full {
    max-width: 100%;
  }
  .max-w-md {
    max-width: var(--container-md);
  }
  .max-w-none {
    max-width: none;
  }
  .max-w-page {
    max-width: var(--spacing-page);
  }
  .max-w-prose {
    max-width: 65ch;
  }
  .max-w-xl {
    max-width: var(--container-xl);
  }
  .max-w-xs {
    max-width: var(--container-xs);
  }
  .min-w-0 {
    min-width: calc(var(--spacing) * 0);
  }
  .min-w-5 {
    min-width: calc(var(--spacing) * 5);
  }
  .min-w-72 {
    min-width: calc(var(--spacing) * 72);
  }
  .min-w-touch-target {
    min-width: var(--spacing-touch-target);
  }
  .flex-1 {
    flex: 1;
  }
  .flex-auto {
    flex: auto;
  }
  .flex-none {
    flex: none;
  }
  .flex-shrink {
    flex-shrink: 1;
  }
  .shrink {
    flex-shrink: 1;
  }
  .shrink-0 {
    flex-shrink: 0;
  }
  .grow {
    flex-grow: 1;
  }
  .basis-0 {
    flex-basis: calc(var(--spacing) * 0);
  }
  .border-collapse {
    border-collapse: collapse;
  }
  .origin-top {
    transform-origin: top;
  }
  .-translate-x-1 {
    --tw-translate-x: calc(var(--spacing) * -1);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .-translate-x-1\/2 {
    --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .translate-x-1 {
    --tw-translate-x: calc(var(--spacing) * 1);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .translate-x-1\/2 {
    --tw-translate-x: calc(1 / 2 * 100%);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .-translate-y-0 {
    --tw-translate-y: calc(var(--spacing) * -0);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .-translate-y-1 {
    --tw-translate-y: calc(var(--spacing) * -1);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .-translate-y-1\/2 {
    --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .translate-y-0 {
    --tw-translate-y: calc(var(--spacing) * 0);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .translate-y-1 {
    --tw-translate-y: calc(var(--spacing) * 1);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .translate-y-3 {
    --tw-translate-y: calc(var(--spacing) * 3);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .translate-y-6 {
    --tw-translate-y: calc(var(--spacing) * 6);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .translate-y-11 {
    --tw-translate-y: calc(var(--spacing) * 11);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .scale-110 {
    --tw-scale-x: 110%;
    --tw-scale-y: 110%;
    --tw-scale-z: 110%;
    scale: var(--tw-scale-x) var(--tw-scale-y);
  }
  .-scale-x-100 {
    --tw-scale-x: calc(100% * -1);
    scale: var(--tw-scale-x) var(--tw-scale-y);
  }
  .-rotate-2 {
    rotate: calc(2deg * -1);
  }
  .rotate-180 {
    rotate: 180deg;
  }
  .\[transform\:translateY\(0\)\] {
    transform: translateY(0);
  }
  .transform {
    transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);
  }
  .transform-\[translateX\(0\)\] {
    transform: translateX(0);
  }
  .transform-\[translateX\(100\%\)\] {
    transform: translateX(100%);
  }
  .transform-\[translateZ\(1px\)\] {
    transform: translateZ(1px);
  }
  .transform-\[translateZ\(7px\)\] {
    transform: translateZ(7px);
  }
  .cursor-not-allowed {
    cursor: not-allowed;
  }
  .cursor-pointer {
    cursor: pointer;
  }
  .cursor-wait {
    cursor: wait;
  }
  .cursor-zoom-in {
    cursor: zoom-in;
  }
  .resize {
    resize: both;
  }
  .snap-none {
    scroll-snap-type: none;
  }
  .snap-x {
    scroll-snap-type: x var(--tw-scroll-snap-strictness);
  }
  .snap-mandatory {
    --tw-scroll-snap-strictness: mandatory;
  }
  .snap-center {
    scroll-snap-align: center;
  }
  .snap-start {
    scroll-snap-align: start;
  }
  .scrollbar-none {
    scrollbar-width: none;
  }
  .list-decimal {
    list-style-type: decimal;
  }
  .list-disc {
    list-style-type: disc;
  }
  .list-none {
    list-style-type: none;
  }
  .\[appearance\:textfield\] {
    appearance: textfield;
  }
  .appearance-none {
    appearance: none;
  }
  .columns-2 {
    columns: 2;
  }
  .columns-3 {
    columns: 3;
  }
  .columns-4 {
    columns: 4;
  }
  .grid-cols-1 {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
  .grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .grid-cols-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .grid-cols-5 {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
  .product-grid {
    @media (min-width: 768px) {
      grid-template-columns: 2fr 1fr;
    }
  }
  .flex-col {
    flex-direction: column;
  }
  .flex-col-reverse {
    flex-direction: column-reverse;
  }
  .flex-row {
    flex-direction: row;
  }
  .flex-nowrap {
    flex-wrap: nowrap;
  }
  .flex-wrap {
    flex-wrap: wrap;
  }
  .items-baseline {
    align-items: baseline;
  }
  .items-center {
    align-items: center;
  }
  .items-end {
    align-items: flex-end;
  }
  .items-start {
    align-items: flex-start;
  }
  .justify-between {
    justify-content: space-between;
  }
  .justify-center {
    justify-content: center;
  }
  .justify-end {
    justify-content: flex-end;
  }
  .gap-0 {
    gap: calc(var(--spacing) * 0);
  }
  .gap-0\.5 {
    gap: calc(var(--spacing) * 0.5);
  }
  .gap-1 {
    gap: calc(var(--spacing) * 1);
  }
  .gap-1\.5 {
    gap: calc(var(--spacing) * 1.5);
  }
  .gap-2 {
    gap: calc(var(--spacing) * 2);
  }
  .gap-2\.5 {
    gap: calc(var(--spacing) * 2.5);
  }
  .gap-3 {
    gap: calc(var(--spacing) * 3);
  }
  .gap-4 {
    gap: calc(var(--spacing) * 4);
  }
  .gap-5 {
    gap: calc(var(--spacing) * 5);
  }
  .gap-6 {
    gap: calc(var(--spacing) * 6);
  }
  .gap-7 {
    gap: calc(var(--spacing) * 7);
  }
  .gap-8 {
    gap: calc(var(--spacing) * 8);
  }
  .gap-10 {
    gap: calc(var(--spacing) * 10);
  }
  .gap-12 {
    gap: calc(var(--spacing) * 12);
  }
  .space-y-0 {
    :where(& > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 0) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 0) * calc(1 - var(--tw-space-y-reverse)));
    }
  }
  .space-y-1 {
    :where(& > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 1) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 1) * calc(1 - var(--tw-space-y-reverse)));
    }
  }
  .space-y-1\.5 {
    :where(& > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 1.5) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 1.5) * calc(1 - var(--tw-space-y-reverse)));
    }
  }
  .space-y-2 {
    :where(& > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 2) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse)));
    }
  }
  .space-y-4 {
    :where(& > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)));
    }
  }
  .space-y-5 {
    :where(& > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 5) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 5) * calc(1 - var(--tw-space-y-reverse)));
    }
  }
  .gap-x-1 {
    column-gap: calc(var(--spacing) * 1);
  }
  .gap-x-4 {
    column-gap: calc(var(--spacing) * 4);
  }
  .gap-x-6 {
    column-gap: calc(var(--spacing) * 6);
  }
  .gap-x-8 {
    column-gap: calc(var(--spacing) * 8);
  }
  .gap-y-1 {
    row-gap: calc(var(--spacing) * 1);
  }
  .gap-y-2 {
    row-gap: calc(var(--spacing) * 2);
  }
  .gap-y-3 {
    row-gap: calc(var(--spacing) * 3);
  }
  .gap-y-8 {
    row-gap: calc(var(--spacing) * 8);
  }
  .gap-y-10 {
    row-gap: calc(var(--spacing) * 10);
  }
  .gap-y-14 {
    row-gap: calc(var(--spacing) * 14);
  }
  .divide-y {
    :where(& > :not(:last-child)) {
      --tw-divide-y-reverse: 0;
      border-bottom-style: var(--tw-border-style);
      border-top-style: var(--tw-border-style);
      border-top-width: calc(1px * var(--tw-divide-y-reverse));
      border-bottom-width: calc(1px * calc(1 - var(--tw-divide-y-reverse)));
    }
  }
  .divide-border {
    :where(& > :not(:last-child)) {
      border-color: var(--color-border);
    }
  }
  .self-center {
    align-self: center;
  }
  .self-end {
    align-self: flex-end;
  }
  .self-start {
    align-self: flex-start;
  }
  .self-stretch {
    align-self: stretch;
  }
  .justify-self-start {
    justify-self: flex-start;
  }
  .truncate {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .overflow-hidden {
    overflow: hidden;
  }
  .overflow-visible {
    overflow: visible;
  }
  .overflow-x-auto {
    overflow-x: auto;
  }
  .overflow-x-clip {
    overflow-x: clip;
  }
  .overflow-y-auto {
    overflow-y: auto;
  }
  .overscroll-x-contain {
    overscroll-behavior-x: contain;
  }
  .rounded {
    border-radius: var(--radius);
  }
  .rounded-2xl {
    border-radius: var(--radius-2xl);
  }
  .rounded-3xl {
    border-radius: var(--radius-3xl);
  }
  .rounded-\[16px\] {
    border-radius: 16px;
  }
  .rounded-\[50\%\] {
    border-radius: 50%;
  }
  .rounded-\[inherit\] {
    border-radius: inherit;
  }
  .rounded-button {
    border-radius: var(--radius-button);
  }
  .rounded-card {
    border-radius: var(--radius-card);
  }
  .rounded-full {
    border-radius: calc(infinity * 1px);
  }
  .rounded-input {
    border-radius: var(--radius-input);
  }
  .rounded-lg {
    border-radius: var(--radius-lg);
  }
  .rounded-md {
    border-radius: var(--radius-md);
  }
  .rounded-none {
    border-radius: 0;
  }
  .rounded-sm {
    border-radius: var(--radius-sm);
  }
  .rounded-xl {
    border-radius: var(--radius-xl);
  }
  .rounded-t-lg {
    border-top-left-radius: var(--radius-lg);
    border-top-right-radius: var(--radius-lg);
  }
  .rounded-b-none {
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
  }
  .border {
    border-style: var(--tw-border-style);
    border-width: 1px;
  }
  .border-0 {
    border-style: var(--tw-border-style);
    border-width: 0px;
  }
  .border-2 {
    border-style: var(--tw-border-style);
    border-width: 2px;
  }
  .border-s-4 {
    border-inline-start-style: var(--tw-border-style);
    border-inline-start-width: 4px;
  }
  .border-t {
    border-top-style: var(--tw-border-style);
    border-top-width: 1px;
  }
  .border-b {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
  }
  .border-b-0 {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 0px;
  }
  .border-none {
    --tw-border-style: none;
    border-style: none;
  }
  .\[border-color\:color-mix\(in_oklab\,var\(--color-on-surface\)_28\%\,var\(--color-surface\)\)\] {
    border-color: color-mix(in srgb,#171717 28%,#ffffff);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab,var(--color-on-surface) 28%,var(--color-surface));
    }
  }
  .border-border {
    border-color: var(--color-border);
  }
  .border-critical {
    border-color: var(--color-critical);
  }
  .border-current {
    border-color: currentcolor;
  }
  .border-current\/20 {
    border-color: currentcolor;
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab, currentcolor 20%, transparent);
    }
  }
  .border-interactive {
    border-color: var(--color-interactive);
  }
  .border-on-surface {
    border-color: var(--color-on-surface);
  }
  .border-on-surface\/10 {
    border-color: color-mix(in srgb, #171717 10%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab, var(--color-on-surface) 10%, transparent);
    }
  }
  .border-on-surface\/30 {
    border-color: color-mix(in srgb, #171717 30%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab, var(--color-on-surface) 30%, transparent);
    }
  }
  .border-s-critical {
    border-inline-start-color: var(--color-critical);
  }
  .border-s-success {
    border-inline-start-color: var(--color-success);
  }
  .bg-\[\#2f2f36\] {
    background-color: #2f2f36;
  }
  .bg-black {
    background-color: var(--color-black);
  }
  .bg-black\/25 {
    background-color: color-mix(in srgb, #000 25%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-black) 25%, transparent);
    }
  }
  .bg-border {
    background-color: var(--color-border);
  }
  .bg-button-primary {
    background-color: var(--color-button-primary);
  }
  .bg-critical {
    background-color: var(--color-critical);
  }
  .bg-critical\/10 {
    background-color: color-mix(in srgb, #ff6b81 10%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-critical) 10%, transparent);
    }
  }
  .bg-info {
    background-color: var(--color-info);
  }
  .bg-interactive {
    background-color: var(--color-interactive);
  }
  .bg-on-surface {
    background-color: var(--color-on-surface);
  }
  .bg-on-surface\/15 {
    background-color: color-mix(in srgb, #171717 15%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-on-surface) 15%, transparent);
    }
  }
  .bg-overlay {
    background-color: var(--color-overlay);
  }
  .bg-overlay-strong {
    background-color: var(--color-overlay-strong);
  }
  .bg-overlay-subtle {
    background-color: var(--color-overlay-subtle);
  }
  .bg-success {
    background-color: var(--color-success);
  }
  .bg-success\/10 {
    background-color: color-mix(in srgb, #059669 10%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-success) 10%, transparent);
    }
  }
  .bg-surface {
    background-color: var(--color-surface);
  }
  .bg-surface-secondary {
    background-color: var(--color-surface-secondary);
  }
  .bg-surface\/40 {
    background-color: color-mix(in srgb, #ffffff 40%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-surface) 40%, transparent);
    }
  }
  .bg-surface\/45 {
    background-color: color-mix(in srgb, #ffffff 45%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-surface) 45%, transparent);
    }
  }
  .bg-surface\/85 {
    background-color: color-mix(in srgb, #ffffff 85%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-surface) 85%, transparent);
    }
  }
  .bg-surface\/90 {
    background-color: color-mix(in srgb, #ffffff 90%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-surface) 90%, transparent);
    }
  }
  .bg-transparent {
    background-color: transparent;
  }
  .bg-warning {
    background-color: var(--color-warning);
  }
  .bg-linear-to-r {
    --tw-gradient-position: to right;
    @supports (background-image: linear-gradient(in lab, red, red)) {
      --tw-gradient-position: to right in oklab;
    }
    background-image: linear-gradient(var(--tw-gradient-stops));
  }
  .bg-linear-to-t {
    --tw-gradient-position: to top;
    @supports (background-image: linear-gradient(in lab, red, red)) {
      --tw-gradient-position: to top in oklab;
    }
    background-image: linear-gradient(var(--tw-gradient-stops));
  }
  .bg-gradient-to-t {
    --tw-gradient-position: to top in oklab;
    background-image: linear-gradient(var(--tw-gradient-stops));
  }
  .bg-\[linear-gradient\(to_bottom\,\#f5f5f7_0\%\,\#c9c9cf_22\%\,\#6d6d76_55\%\,\#2f2f36_78\%\,\#8c8c95_100\%\)\] {
    background-image: linear-gradient(to bottom,#f5f5f7 0%,#c9c9cf 22%,#6d6d76 55%,#2f2f36 78%,#8c8c95 100%);
  }
  .bg-\[linear-gradient\(to_right\,\#8c8c95\,\#e4e4e9_45\%\,\#55555d\)\] {
    background-image: linear-gradient(to right,#8c8c95,#e4e4e9 45%,#55555d);
  }
  .bg-\[radial-gradient\(ellipse_at_top\,var\(--color-surface-secondary\)\,var\(--color-surface\)_70\%\)\] {
    background-image: radial-gradient(ellipse at top,var(--color-surface-secondary),var(--color-surface) 70%);
  }
  .from-interactive {
    --tw-gradient-from: var(--color-interactive);
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }
  .from-interactive\/90 {
    --tw-gradient-from: color-mix(in srgb, #171717 90%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      --tw-gradient-from: color-mix(in oklab, var(--color-interactive) 90%, transparent);
    }
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }
  .from-surface {
    --tw-gradient-from: var(--color-surface);
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }
  .from-surface\/70 {
    --tw-gradient-from: color-mix(in srgb, #ffffff 70%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      --tw-gradient-from: color-mix(in oklab, var(--color-surface) 70%, transparent);
    }
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }
  .from-surface\/80 {
    --tw-gradient-from: color-mix(in srgb, #ffffff 80%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      --tw-gradient-from: color-mix(in oklab, var(--color-surface) 80%, transparent);
    }
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }
  .via-surface {
    --tw-gradient-via: var(--color-surface);
    --tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-via-stops);
  }
  .via-surface\/70 {
    --tw-gradient-via: color-mix(in srgb, #ffffff 70%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      --tw-gradient-via: color-mix(in oklab, var(--color-surface) 70%, transparent);
    }
    --tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-via-stops);
  }
  .via-transparent {
    --tw-gradient-via: transparent;
    --tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-via-stops);
  }
  .to-surface {
    --tw-gradient-to: var(--color-surface);
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }
  .to-surface\/10 {
    --tw-gradient-to: color-mix(in srgb, #ffffff 10%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      --tw-gradient-to: color-mix(in oklab, var(--color-surface) 10%, transparent);
    }
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }
  .to-transparent {
    --tw-gradient-to: transparent;
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }
  .object-contain {
    object-fit: contain;
  }
  .object-cover {
    object-fit: cover;
  }
  .\!p-0 {
    padding: calc(var(--spacing) * 0) !important;
  }
  .p-0 {
    padding: calc(var(--spacing) * 0);
  }
  .p-2 {
    padding: calc(var(--spacing) * 2);
  }
  .p-3 {
    padding: calc(var(--spacing) * 3);
  }
  .p-4 {
    padding: calc(var(--spacing) * 4);
  }
  .p-6 {
    padding: calc(var(--spacing) * 6);
  }
  .p-8 {
    padding: calc(var(--spacing) * 8);
  }
  .p-10 {
    padding: calc(var(--spacing) * 10);
  }
  .px-0 {
    padding-inline: calc(var(--spacing) * 0);
  }
  .px-1 {
    padding-inline: calc(var(--spacing) * 1);
  }
  .px-2 {
    padding-inline: calc(var(--spacing) * 2);
  }
  .px-3 {
    padding-inline: calc(var(--spacing) * 3);
  }
  .px-4 {
    padding-inline: calc(var(--spacing) * 4);
  }
  .px-5 {
    padding-inline: calc(var(--spacing) * 5);
  }
  .px-6 {
    padding-inline: calc(var(--spacing) * 6);
  }
  .px-7 {
    padding-inline: calc(var(--spacing) * 7);
  }
  .px-8 {
    padding-inline: calc(var(--spacing) * 8);
  }
  .px-14 {
    padding-inline: calc(var(--spacing) * 14);
  }
  .px-20 {
    padding-inline: calc(var(--spacing) * 20);
  }
  .px-margin {
    padding-inline: var(--spacing-margin);
  }
  .\!py-8 {
    padding-block: calc(var(--spacing) * 8) !important;
  }
  .\!py-14 {
    padding-block: calc(var(--spacing) * 14) !important;
  }
  .py-0 {
    padding-block: calc(var(--spacing) * 0);
  }
  .py-1 {
    padding-block: calc(var(--spacing) * 1);
  }
  .py-1\.5 {
    padding-block: calc(var(--spacing) * 1.5);
  }
  .py-2 {
    padding-block: calc(var(--spacing) * 2);
  }
  .py-3 {
    padding-block: calc(var(--spacing) * 3);
  }
  .py-4 {
    padding-block: calc(var(--spacing) * 4);
  }
  .py-6 {
    padding-block: calc(var(--spacing) * 6);
  }
  .py-8 {
    padding-block: calc(var(--spacing) * 8);
  }
  .py-10 {
    padding-block: calc(var(--spacing) * 10);
  }
  .py-12 {
    padding-block: calc(var(--spacing) * 12);
  }
  .py-14 {
    padding-block: calc(var(--spacing) * 14);
  }
  .py-16 {
    padding-block: calc(var(--spacing) * 16);
  }
  .py-20 {
    padding-block: calc(var(--spacing) * 20);
  }
  .py-24 {
    padding-block: calc(var(--spacing) * 24);
  }
  .py-32 {
    padding-block: calc(var(--spacing) * 32);
  }
  .py-\[4\%\] {
    padding-block: 4%;
  }
  .py-\[clamp\(64px\,8svh\,128px\)\] {
    padding-block: clamp(64px, 8svh, 128px);
  }
  .\[padding-inline-start\:max\(clamp\(24px\,4\.5vw\,72px\)\,var\(--safe-area-inset-inline-start\)\)\] {
    padding-inline-start: max(clamp(24px, 4.5vw, 72px), var(--safe-area-inset-inline-start));
  }
  .ps-0 {
    padding-inline-start: calc(var(--spacing) * 0);
  }
  .ps-1 {
    padding-inline-start: calc(var(--spacing) * 1);
  }
  .ps-1\.5 {
    padding-inline-start: calc(var(--spacing) * 1.5);
  }
  .ps-3 {
    padding-inline-start: calc(var(--spacing) * 3);
  }
  .ps-4 {
    padding-inline-start: calc(var(--spacing) * 4);
  }
  .ps-6 {
    padding-inline-start: calc(var(--spacing) * 6);
  }
  .\[padding-inline-end\:max\(clamp\(24px\,4\.5vw\,72px\)\,var\(--safe-area-inset-inline-end\)\)\] {
    padding-inline-end: max(clamp(24px, 4.5vw, 72px), var(--safe-area-inset-inline-end));
  }
  .pe-0 {
    padding-inline-end: calc(var(--spacing) * 0);
  }
  .pe-2 {
    padding-inline-end: calc(var(--spacing) * 2);
  }
  .pe-2\.5 {
    padding-inline-end: calc(var(--spacing) * 2.5);
  }
  .pe-9 {
    padding-inline-end: calc(var(--spacing) * 9);
  }
  .pe-12 {
    padding-inline-end: calc(var(--spacing) * 12);
  }
  .pe-28 {
    padding-inline-end: calc(var(--spacing) * 28);
  }
  .\[padding-block-start\:max\(3rem\,var\(--safe-area-inset-top\)\)\] {
    padding-block-start: max(3rem, var(--safe-area-inset-top));
  }
  .\[padding-block-end\:max\(3rem\,var\(--safe-area-inset-bottom\)\)\] {
    padding-block-end: max(3rem, var(--safe-area-inset-bottom));
  }
  .\!pt-6 {
    padding-top: calc(var(--spacing) * 6) !important;
  }
  .pt-1 {
    padding-top: calc(var(--spacing) * 1);
  }
  .pt-2 {
    padding-top: calc(var(--spacing) * 2);
  }
  .pt-3 {
    padding-top: calc(var(--spacing) * 3);
  }
  .pt-4 {
    padding-top: calc(var(--spacing) * 4);
  }
  .pt-6 {
    padding-top: calc(var(--spacing) * 6);
  }
  .pt-7 {
    padding-top: calc(var(--spacing) * 7);
  }
  .pt-8 {
    padding-top: calc(var(--spacing) * 8);
  }
  .pt-14 {
    padding-top: calc(var(--spacing) * 14);
  }
  .pt-16 {
    padding-top: calc(var(--spacing) * 16);
  }
  .pt-20 {
    padding-top: calc(var(--spacing) * 20);
  }
  .pt-24 {
    padding-top: calc(var(--spacing) * 24);
  }
  .pt-28 {
    padding-top: calc(var(--spacing) * 28);
  }
  .pt-32 {
    padding-top: calc(var(--spacing) * 32);
  }
  .pt-\[clamp\(0\.65rem\,2\.4vw\,1\.25rem\)\] {
    padding-top: clamp(0.65rem, 2.4vw, 1.25rem);
  }
  .\!pb-0 {
    padding-bottom: calc(var(--spacing) * 0) !important;
  }
  .pb-0 {
    padding-bottom: calc(var(--spacing) * 0);
  }
  .pb-1 {
    padding-bottom: calc(var(--spacing) * 1);
  }
  .pb-2 {
    padding-bottom: calc(var(--spacing) * 2);
  }
  .pb-4 {
    padding-bottom: calc(var(--spacing) * 4);
  }
  .pb-5 {
    padding-bottom: calc(var(--spacing) * 5);
  }
  .pb-6 {
    padding-bottom: calc(var(--spacing) * 6);
  }
  .pb-8 {
    padding-bottom: calc(var(--spacing) * 8);
  }
  .pb-10 {
    padding-bottom: calc(var(--spacing) * 10);
  }
  .pb-12 {
    padding-bottom: calc(var(--spacing) * 12);
  }
  .pb-14 {
    padding-bottom: calc(var(--spacing) * 14);
  }
  .pb-16 {
    padding-bottom: calc(var(--spacing) * 16);
  }
  .pb-20 {
    padding-bottom: calc(var(--spacing) * 20);
  }
  .pb-24 {
    padding-bottom: calc(var(--spacing) * 24);
  }
  .pb-\[6\%\] {
    padding-bottom: 6%;
  }
  .pb-\[clamp\(24px\,3vh\,40px\)\] {
    padding-bottom: clamp(24px, 3vh, 40px);
  }
  .text-center {
    text-align: center;
  }
  .text-end {
    text-align: end;
  }
  .text-start {
    text-align: start;
  }
  .font-body {
    font-family: var(--font-body);
  }
  .font-heading {
    font-family: var(--font-heading);
  }
  .font-mono {
    font-family: var(--font-mono);
  }
  .text-2xl {
    font-size: var(--text-2xl);
    line-height: var(--tw-leading, var(--text-2xl--line-height));
  }
  .text-3xl {
    font-size: var(--text-3xl);
    line-height: var(--tw-leading, var(--text-3xl--line-height));
  }
  .text-4xl {
    font-size: var(--text-4xl);
    line-height: var(--tw-leading, var(--text-4xl--line-height));
  }
  .text-5xl {
    font-size: var(--text-5xl);
    line-height: var(--tw-leading, var(--text-5xl--line-height));
  }
  .text-6xl {
    font-size: var(--text-6xl);
    line-height: var(--tw-leading, var(--text-6xl--line-height));
  }
  .text-7xl {
    font-size: var(--text-7xl);
    line-height: var(--tw-leading, var(--text-7xl--line-height));
  }
  .text-base {
    font-size: var(--text-base);
    line-height: var(--tw-leading, var(--text-base--line-height));
  }
  .text-lg {
    font-size: var(--text-lg);
    line-height: var(--tw-leading, var(--text-lg--line-height));
  }
  .text-sm {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
  }
  .text-xl {
    font-size: var(--text-xl);
    line-height: var(--tw-leading, var(--text-xl--line-height));
  }
  .text-xs {
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
  }
  .text-\[clamp\(0\.5rem\,1\.5vw\,0\.7rem\)\] {
    font-size: clamp(0.5rem, 1.5vw, 0.7rem);
  }
  .text-\[clamp\(0\.5rem\,1\.25vw\,0\.65rem\)\] {
    font-size: clamp(0.5rem, 1.25vw, 0.65rem);
  }
  .text-\[clamp\(0\.45rem\,1\.5vw\,0\.7rem\)\] {
    font-size: clamp(0.45rem, 1.5vw, 0.7rem);
  }
  .text-\[clamp\(0\.875rem\,3\.6vw\,1\.375rem\)\] {
    font-size: clamp(0.875rem, 3.6vw, 1.375rem);
  }
  .text-\[clamp\(1\.6rem\,6vw\,3\.15rem\)\] {
    font-size: clamp(1.6rem, 6vw, 3.15rem);
  }
  .text-\[min\(3em\,50cqw\)\] {
    font-size: min(3em, 50cqw);
  }
  .leading-\[0\.8\] {
    --tw-leading: 0.8;
    line-height: 0.8;
  }
  .leading-\[0\.9\] {
    --tw-leading: 0.9;
    line-height: 0.9;
  }
  .leading-\[1\.05\] {
    --tw-leading: 1.05;
    line-height: 1.05;
  }
  .leading-\[1\.35\] {
    --tw-leading: 1.35;
    line-height: 1.35;
  }
  .leading-none {
    --tw-leading: 1;
    line-height: 1;
  }
  .leading-normal {
    --tw-leading: var(--leading-normal);
    line-height: var(--leading-normal);
  }
  .leading-relaxed {
    --tw-leading: var(--leading-relaxed);
    line-height: var(--leading-relaxed);
  }
  .leading-snug {
    --tw-leading: var(--leading-snug);
    line-height: var(--leading-snug);
  }
  .leading-tight {
    --tw-leading: var(--leading-tight);
    line-height: var(--leading-tight);
  }
  .font-bold {
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
  }
  .font-light {
    --tw-font-weight: var(--font-weight-light);
    font-weight: var(--font-weight-light);
  }
  .font-medium {
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
  }
  .font-normal {
    --tw-font-weight: var(--font-weight-normal);
    font-weight: var(--font-weight-normal);
  }
  .font-semibold {
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
  }
  .tracking-\[-0\.045em\] {
    --tw-tracking: -0.045em;
    letter-spacing: -0.045em;
  }
  .tracking-\[-0\.065em\] {
    --tw-tracking: -0.065em;
    letter-spacing: -0.065em;
  }
  .tracking-\[0\.2em\] {
    --tw-tracking: 0.2em;
    letter-spacing: 0.2em;
  }
  .tracking-\[0\.12em\] {
    --tw-tracking: 0.12em;
    letter-spacing: 0.12em;
  }
  .tracking-\[0\.13em\] {
    --tw-tracking: 0.13em;
    letter-spacing: 0.13em;
  }
  .tracking-tight {
    --tw-tracking: var(--tracking-tight);
    letter-spacing: var(--tracking-tight);
  }
  .tracking-wider {
    --tw-tracking: var(--tracking-wider);
    letter-spacing: var(--tracking-wider);
  }
  .tracking-widest {
    --tw-tracking: var(--tracking-widest);
    letter-spacing: var(--tracking-widest);
  }
  .text-balance {
    text-wrap: balance;
  }
  .text-pretty {
    text-wrap: pretty;
  }
  .text-wrap {
    text-wrap: wrap;
  }
  .break-words {
    overflow-wrap: break-word;
  }
  .wrap-anywhere {
    overflow-wrap: anywhere;
  }
  .break-all {
    word-break: break-all;
  }
  .whitespace-normal {
    white-space: normal;
  }
  .whitespace-nowrap {
    white-space: nowrap;
  }
  .text-accent {
    color: var(--color-accent);
  }
  .text-button-primary-text {
    color: var(--color-button-primary-text);
  }
  .text-compare {
    color: var(--color-compare);
  }
  .text-critical {
    color: var(--color-critical);
  }
  .text-inherit {
    color: inherit;
  }
  .text-interactive {
    color: var(--color-interactive);
  }
  .text-interactive-text {
    color: var(--color-interactive-text);
  }
  .text-on-surface {
    color: var(--color-on-surface);
  }
  .text-on-surface-secondary {
    color: var(--color-on-surface-secondary);
  }
  .text-sale {
    color: var(--color-sale);
  }
  .text-surface {
    color: var(--color-surface);
  }
  .text-warning-text {
    color: var(--color-warning-text);
  }
  .capitalize {
    text-transform: capitalize;
  }
  .uppercase {
    text-transform: uppercase;
  }
  .italic {
    font-style: italic;
  }
  .line-through {
    text-decoration-line: line-through;
  }
  .no-underline {
    text-decoration-line: none;
  }
  .overline {
    text-decoration-line: overline;
  }
  .underline {
    text-decoration-line: underline;
  }
  .decoration-border {
    text-decoration-color: var(--color-border);
  }
  .decoration-current {
    text-decoration-color: currentcolor;
  }
  .underline-offset-2 {
    text-underline-offset: 2px;
  }
  .underline-offset-4 {
    text-underline-offset: 4px;
  }
  .antialiased {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }
  .opacity-0 {
    opacity: 0%;
  }
  .opacity-40 {
    opacity: 40%;
  }
  .opacity-50 {
    opacity: 50%;
  }
  .opacity-60 {
    opacity: 60%;
  }
  .opacity-70 {
    opacity: 70%;
  }
  .opacity-80 {
    opacity: 80%;
  }
  .opacity-100 {
    opacity: 100%;
  }
  .mix-blend-screen {
    mix-blend-mode: screen;
  }
  .shadow {
    --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .shadow-\[0_6px_12px_rgba\(0\,0\,0\,0\.6\)\] {
    --tw-shadow: 0 6px 12px var(--tw-shadow-color, rgba(0,0,0,0.6));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .shadow-\[0_8px_14px_rgba\(0\,0\,0\,0\.6\)\] {
    --tw-shadow: 0 8px 14px var(--tw-shadow-color, rgba(0,0,0,0.6));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .shadow-lg {
    --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .shadow-none {
    --tw-shadow: 0 0 #0000;
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .shadow-xl {
    --tw-shadow: 0 25px 50px -12px var(--tw-shadow-color, rgb(0 0 0 / 0.6));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .ring {
    --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .ring-1 {
    --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .ring-2 {
    --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .ring-accent {
    --tw-ring-color: var(--color-accent);
  }
  .ring-border {
    --tw-ring-color: var(--color-border);
  }
  .ring-offset-2 {
    --tw-ring-offset-width: 2px;
    --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  }
  .outline {
    outline-style: var(--tw-outline-style);
    outline-width: 1px;
  }
  .outline-2 {
    outline-style: var(--tw-outline-style);
    outline-width: 2px;
  }
  .-outline-offset-2 {
    outline-offset: calc(2px * -1);
  }
  .outline-offset-2 {
    outline-offset: 2px;
  }
  .outline-accent {
    outline-color: var(--color-accent);
  }
  .outline-current {
    outline-color: currentcolor;
  }
  .outline-interactive-text {
    outline-color: var(--color-interactive-text);
  }
  .blur {
    --tw-blur: blur(8px);
    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
  }
  .blur-2xl {
    --tw-blur: blur(var(--blur-2xl));
    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
  }
  .drop-shadow {
    --tw-drop-shadow-size: drop-shadow(0 1px 2px var(--tw-drop-shadow-color, rgb(0 0 0 / 0.1))) drop-shadow(0 1px 1px var(--tw-drop-shadow-color, rgb(0 0 0 / 0.06)));
    --tw-drop-shadow: drop-shadow(0 1px 2px rgb(0 0 0 / 0.1)) drop-shadow( 0 1px 1px rgb(0 0 0 / 0.06));
    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
  }
  .drop-shadow-\[0_6px_6px_rgba\(0\,0\,0\,0\.55\)\] {
    --tw-drop-shadow-size: drop-shadow(0 6px 6px var(--tw-drop-shadow-color, rgba(0,0,0,0.55)));
    --tw-drop-shadow: var(--tw-drop-shadow-size);
    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
  }
  .grayscale {
    --tw-grayscale: grayscale(100%);
    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
  }
  .invert {
    --tw-invert: invert(100%);
    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
  }
  .sepia {
    --tw-sepia: sepia(100%);
    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
  }
  .filter {
    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
  }
  .backdrop-blur-md {
    --tw-backdrop-blur: blur(var(--blur-md));
    -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
    backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
  }
  .backdrop-blur-sm {
    --tw-backdrop-blur: blur(var(--blur-sm));
    -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
    backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
  }
  .backdrop-filter {
    -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
    backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
  }
  .transition {
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .transition-\[height\] {
    transition-property: height;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .transition-colors {
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .transition-opacity {
    transition-property: opacity;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .transition-transform {
    transition-property: transform, translate, scale, rotate;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .duration-150 {
    --tw-duration: 150ms;
    transition-duration: 150ms;
  }
  .duration-180 {
    --tw-duration: 180ms;
    transition-duration: 180ms;
  }
  .duration-200 {
    --tw-duration: 200ms;
    transition-duration: 200ms;
  }
  .duration-250 {
    --tw-duration: 250ms;
    transition-duration: 250ms;
  }
  .duration-280 {
    --tw-duration: 280ms;
    transition-duration: 280ms;
  }
  .duration-300 {
    --tw-duration: 300ms;
    transition-duration: 300ms;
  }
  .ease-in-out {
    --tw-ease: var(--ease-in-out);
    transition-timing-function: var(--ease-in-out);
  }
  .ease-out {
    --tw-ease: var(--ease-out);
    transition-timing-function: var(--ease-out);
  }
  .ease-ui {
    --tw-ease: var(--ease-ui);
    transition-timing-function: var(--ease-ui);
  }
  .contain-paint {
    --tw-contain-paint: paint;
    contain: var(--tw-contain-size,) var(--tw-contain-layout,) var(--tw-contain-paint,) var(--tw-contain-style,);
  }
  .outline-none {
    --tw-outline-style: none;
    outline-style: none;
  }
  .select-all {
    -webkit-user-select: all;
    user-select: all;
  }
  .select-none {
    -webkit-user-select: none;
    user-select: none;
  }
  .\[--panel-backdrop\:transparent\] {
    --panel-backdrop: transparent;
  }
  .\[--panel-closed-transform\:translateX\(-100\%\)\] {
    --panel-closed-transform: translateX(-100%);
  }
  .\[--panel-closed-transform\:translateX\(100\%\)\] {
    --panel-closed-transform: translateX(100%);
  }
  .\[--panel-closed-transform\:translateY\(16px\)_scale\(0\.96\)\] {
    --panel-closed-transform: translateY(16px) scale(0.96);
  }
  .\[--panel-closed-transform\:translateY\(100\%\)\] {
    --panel-closed-transform: translateY(100%);
  }
  .\[--section-height\:620px\] {
    --section-height: 620px;
  }
  .\[--shopify-accelerated-checkout-button-block-size\:var\(--spacing-touch-target\)\] {
    --shopify-accelerated-checkout-button-block-size: var(--spacing-touch-target);
  }
  .\[--shopify-accelerated-checkout-button-border-radius\:var\(--radius-button\)\] {
    --shopify-accelerated-checkout-button-border-radius: var(--radius-button);
  }
  .\[--shopify-accelerated-checkout-button-box-shadow\:none\] {
    --shopify-accelerated-checkout-button-box-shadow: none;
  }
  .\[--shopify-accelerated-checkout-skeleton-background-color\:var\(--color-surface-secondary\)\] {
    --shopify-accelerated-checkout-skeleton-background-color: var(--color-surface-secondary);
  }
  .\[background\:linear-gradient\(to_top_right\,transparent_calc\(50\%_-_0\.5px\)\,var\(--color-on-surface\)_50\%\,transparent_calc\(50\%_\+_0\.5px\)\)\] {
    background: linear-gradient(to top right,transparent calc(50% - 0.5px),var(--color-on-surface) 50%,transparent calc(50% + 0.5px));
  }
  .\[contain-intrinsic-block-size\:auto_var\(--section-height\,500px\)\] {
    contain-intrinsic-block-size: auto var(--section-height,500px);
  }
  .\[content-visibility\:auto\] {
    content-visibility: auto;
  }
  .\[transition\:opacity_0\.2s_var\(--ease-ui\)\,transform_0\.25s_var\(--ease-ui\)\,display_0\.25s_allow-discrete\] {
    transition: opacity 0.2s var(--ease-ui),transform 0.25s var(--ease-ui),display 0.25s allow-discrete;
  }
  .\[view-transition-name\:cart-total\] {
    view-transition-name: cart-total;
  }
  .backface-hidden {
    backface-visibility: hidden;
  }
  .transform-3d {
    transform-style: preserve-3d;
  }
  .group-open\:rotate-180 {
    &:is(:where(.group):is([open], :popover-open, :open) *) {
      rotate: 180deg;
    }
  }
  .group-focus-within\/card\:translate-y-0 {
    &:is(:where(.group\/card):focus-within *) {
      --tw-translate-y: calc(var(--spacing) * 0);
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }
  }
  .group-focus-within\/card\:opacity-100 {
    &:is(:where(.group\/card):focus-within *) {
      opacity: 100%;
    }
  }
  .group-hover\:opacity-100 {
    &:is(:where(.group):hover *) {
      @media (hover: hover) {
        opacity: 100%;
      }
    }
  }
  .group-hover\/card\:translate-y-0 {
    &:is(:where(.group\/card):hover *) {
      @media (hover: hover) {
        --tw-translate-y: calc(var(--spacing) * 0);
        translate: var(--tw-translate-x) var(--tw-translate-y);
      }
    }
  }
  .group-hover\/card\:opacity-100 {
    &:is(:where(.group\/card):hover *) {
      @media (hover: hover) {
        opacity: 100%;
      }
    }
  }
  .group-has-\[\:checked\]\/filter\:border-interactive {
    &:is(:where(.group\/filter):has(*:is(:checked)) *) {
      border-color: var(--color-interactive);
    }
  }
  .group-has-\[\:checked\]\/filter\:bg-interactive {
    &:is(:where(.group\/filter):has(*:is(:checked)) *) {
      background-color: var(--color-interactive);
    }
  }
  .group-has-\[\:checked\]\/filter\:opacity-100 {
    &:is(:where(.group\/filter):has(*:is(:checked)) *) {
      opacity: 100%;
    }
  }
  .group-has-\[\:checked\]\/swatch\:border-interactive {
    &:is(:where(.group\/swatch):has(*:is(:checked)) *) {
      border-color: var(--color-interactive);
    }
  }
  .group-has-\[\:checked\]\/swatch\:opacity-100 {
    &:is(:where(.group\/swatch):has(*:is(:checked)) *) {
      opacity: 100%;
    }
  }
  .group-has-\[\:focus-visible\]\/filter\:ring-2 {
    &:is(:where(.group\/filter):has(*:is(:focus-visible)) *) {
      --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
  }
  .group-has-\[\:focus-visible\]\/filter\:ring-accent {
    &:is(:where(.group\/filter):has(*:is(:focus-visible)) *) {
      --tw-ring-color: var(--color-accent);
    }
  }
  .group-has-\[\:focus-visible\]\/filter\:ring-offset-2 {
    &:is(:where(.group\/filter):has(*:is(:focus-visible)) *) {
      --tw-ring-offset-width: 2px;
      --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
    }
  }
  .group-has-\[\:focus-visible\]\/swatch\:ring-2 {
    &:is(:where(.group\/swatch):has(*:is(:focus-visible)) *) {
      --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
  }
  .group-has-\[\:focus-visible\]\/swatch\:ring-accent {
    &:is(:where(.group\/swatch):has(*:is(:focus-visible)) *) {
      --tw-ring-color: var(--color-accent);
    }
  }
  .group-has-\[\:focus-visible\]\/swatch\:ring-offset-2 {
    &:is(:where(.group\/swatch):has(*:is(:focus-visible)) *) {
      --tw-ring-offset-width: 2px;
      --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
    }
  }
  .group-has-\[figure_img\]\:block {
    &:is(:where(.group):has(*:is(figure img)) *) {
      display: block;
    }
  }
  .group-has-\[figure_img\]\:min-h-\[58svh\] {
    &:is(:where(.group):has(*:is(figure img)) *) {
      min-height: 58svh;
    }
  }
  .group-\[\.text-center\]\/card\:self-center {
    &:is(:where(.group\/card):is(.text-center) *) {
      align-self: center;
    }
  }
  .group-\[\.text-end\]\/card\:self-end {
    &:is(:where(.group\/card):is(.text-end) *) {
      align-self: flex-end;
    }
  }
  .peer-checked\:border-interactive {
    &:is(:where(.peer):checked ~ *) {
      border-color: var(--color-interactive);
    }
  }
  .peer-checked\:bg-interactive {
    &:is(:where(.peer):checked ~ *) {
      background-color: var(--color-interactive);
    }
  }
  .peer-checked\:text-interactive-text {
    &:is(:where(.peer):checked ~ *) {
      color: var(--color-interactive-text);
    }
  }
  .peer-placeholder-shown\:hidden {
    &:is(:where(.peer):placeholder-shown ~ *) {
      display: none;
    }
  }
  .peer-focus-visible\:ring-2 {
    &:is(:where(.peer):focus-visible ~ *) {
      --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
  }
  .peer-focus-visible\:ring-accent {
    &:is(:where(.peer):focus-visible ~ *) {
      --tw-ring-color: var(--color-accent);
    }
  }
  .peer-focus-visible\:ring-offset-2 {
    &:is(:where(.peer):focus-visible ~ *) {
      --tw-ring-offset-width: 2px;
      --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
    }
  }
  .placeholder\:text-on-surface-secondary {
    &::placeholder {
      color: var(--color-on-surface-secondary);
    }
  }
  .hover\:border-interactive {
    &:hover {
      @media (hover: hover) {
        border-color: var(--color-interactive);
      }
    }
  }
  .hover\:border-on-surface {
    &:hover {
      @media (hover: hover) {
        border-color: var(--color-on-surface);
      }
    }
  }
  .hover\:bg-border {
    &:hover {
      @media (hover: hover) {
        background-color: var(--color-border);
      }
    }
  }
  .hover\:bg-overlay-strong {
    &:hover {
      @media (hover: hover) {
        background-color: var(--color-overlay-strong);
      }
    }
  }
  .hover\:bg-surface-secondary {
    &:hover {
      @media (hover: hover) {
        background-color: var(--color-surface-secondary);
      }
    }
  }
  .hover\:bg-transparent {
    &:hover {
      @media (hover: hover) {
        background-color: transparent;
      }
    }
  }
  .hover\:text-on-surface {
    &:hover {
      @media (hover: hover) {
        color: var(--color-on-surface);
      }
    }
  }
  .hover\:text-on-surface-secondary {
    &:hover {
      @media (hover: hover) {
        color: var(--color-on-surface-secondary);
      }
    }
  }
  .hover\:underline {
    &:hover {
      @media (hover: hover) {
        text-decoration-line: underline;
      }
    }
  }
  .hover\:decoration-current {
    &:hover {
      @media (hover: hover) {
        text-decoration-color: currentcolor;
      }
    }
  }
  .hover\:opacity-70 {
    &:hover {
      @media (hover: hover) {
        opacity: 70%;
      }
    }
  }
  .hover\:opacity-100 {
    &:hover {
      @media (hover: hover) {
        opacity: 100%;
      }
    }
  }
  .peer-not-checked\:hover\:bg-surface-secondary {
    &:is(:where(.peer):not(*:checked) ~ *) {
      &:hover {
        @media (hover: hover) {
          background-color: var(--color-surface-secondary);
        }
      }
    }
  }
  .focus-visible\:not-sr-only {
    &:focus-visible {
      position: static;
      width: auto;
      height: auto;
      padding: 0;
      margin: 0;
      overflow: visible;
      clip-path: none;
      white-space: normal;
    }
  }
  .focus-visible\:fixed {
    &:focus-visible {
      position: fixed;
    }
  }
  .focus-visible\:inset-s-\[max\(1rem\,var\(--safe-area-inset-inline-start\)\)\] {
    &:focus-visible {
      inset-inline-start: max(1rem, var(--safe-area-inset-inline-start));
    }
  }
  .focus-visible\:inset-bs-\[max\(1rem\,var\(--safe-area-inset-top\)\)\] {
    &:focus-visible {
      inset-block-start: max(1rem, var(--safe-area-inset-top));
    }
  }
  .focus-visible\:z-50 {
    &:focus-visible {
      z-index: 50;
    }
  }
  .focus-visible\:rounded {
    &:focus-visible {
      border-radius: var(--radius);
    }
  }
  .focus-visible\:bg-interactive {
    &:focus-visible {
      background-color: var(--color-interactive);
    }
  }
  .focus-visible\:px-4 {
    &:focus-visible {
      padding-inline: calc(var(--spacing) * 4);
    }
  }
  .focus-visible\:py-2 {
    &:focus-visible {
      padding-block: calc(var(--spacing) * 2);
    }
  }
  .focus-visible\:text-interactive-text {
    &:focus-visible {
      color: var(--color-interactive-text);
    }
  }
  .focus-visible\:opacity-100 {
    &:focus-visible {
      opacity: 100%;
    }
  }
  .focus-visible\:outline {
    &:focus-visible {
      outline-style: var(--tw-outline-style);
      outline-width: 1px;
    }
  }
  .focus-visible\:outline-2 {
    &:focus-visible {
      outline-style: var(--tw-outline-style);
      outline-width: 2px;
    }
  }
  .focus-visible\:-outline-offset-2 {
    &:focus-visible {
      outline-offset: calc(2px * -1);
    }
  }
  .focus-visible\:outline-offset-2 {
    &:focus-visible {
      outline-offset: 2px;
    }
  }
  .focus-visible\:outline-accent {
    &:focus-visible {
      outline-color: var(--color-accent);
    }
  }
  .focus-visible\:outline-current {
    &:focus-visible {
      outline-color: currentcolor;
    }
  }
  .focus-visible\:outline-interactive-text {
    &:focus-visible {
      outline-color: var(--color-interactive-text);
    }
  }
  .active\:transform-\[scale\(0\.90\)\] {
    &:active {
      transform: scale(0.90);
    }
  }
  .disabled\:cursor-not-allowed {
    &:disabled {
      cursor: not-allowed;
    }
  }
  .disabled\:opacity-50 {
    &:disabled {
      opacity: 50%;
    }
  }
  .has-\[\[data-aspect-ratio\=aspect-auto\]\]\:aspect-\[5\/4\] {
    &:has(*:is([data-aspect-ratio=aspect-auto])) {
      aspect-ratio: 5/4;
    }
  }
  .aria-invalid\:border-critical {
    &[aria-invalid="true"] {
      border-color: var(--color-critical);
    }
  }
  .motion-safe\:transition {
    @media (prefers-reduced-motion: no-preference) {
      transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
      transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
      transition-duration: var(--tw-duration, var(--default-transition-duration));
    }
  }
  .motion-safe\:transition-\[background-color\,transform\] {
    @media (prefers-reduced-motion: no-preference) {
      transition-property: background-color,transform;
      transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
      transition-duration: var(--tw-duration, var(--default-transition-duration));
    }
  }
  .motion-safe\:transition-\[color\,background-color\,border-color\,opacity\,transform\,translate\,scale\] {
    @media (prefers-reduced-motion: no-preference) {
      transition-property: color,background-color,border-color,opacity,transform,translate,scale;
      transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
      transition-duration: var(--tw-duration, var(--default-transition-duration));
    }
  }
  .motion-safe\:transition-\[color\,background-color\,transform\] {
    @media (prefers-reduced-motion: no-preference) {
      transition-property: color,background-color,transform;
      transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
      transition-duration: var(--tw-duration, var(--default-transition-duration));
    }
  }
  .motion-safe\:transition-\[color\,transform\] {
    @media (prefers-reduced-motion: no-preference) {
      transition-property: color,transform;
      transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
      transition-duration: var(--tw-duration, var(--default-transition-duration));
    }
  }
  .motion-safe\:transition-\[opacity\,transform\] {
    @media (prefers-reduced-motion: no-preference) {
      transition-property: opacity,transform;
      transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
      transition-duration: var(--tw-duration, var(--default-transition-duration));
    }
  }
  .motion-safe\:transition-\[opacity\,translate\] {
    @media (prefers-reduced-motion: no-preference) {
      transition-property: opacity,translate;
      transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
      transition-duration: var(--tw-duration, var(--default-transition-duration));
    }
  }
  .motion-safe\:transition-\[rotate\,translate\] {
    @media (prefers-reduced-motion: no-preference) {
      transition-property: rotate,translate;
      transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
      transition-duration: var(--tw-duration, var(--default-transition-duration));
    }
  }
  .motion-safe\:transition-colors {
    @media (prefers-reduced-motion: no-preference) {
      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));
    }
  }
  .motion-safe\:transition-opacity {
    @media (prefers-reduced-motion: no-preference) {
      transition-property: opacity;
      transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
      transition-duration: var(--tw-duration, var(--default-transition-duration));
    }
  }
  .motion-safe\:transition-transform {
    @media (prefers-reduced-motion: no-preference) {
      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));
    }
  }
  .motion-safe\:duration-150 {
    @media (prefers-reduced-motion: no-preference) {
      --tw-duration: 150ms;
      transition-duration: 150ms;
    }
  }
  .motion-safe\:duration-200 {
    @media (prefers-reduced-motion: no-preference) {
      --tw-duration: 200ms;
      transition-duration: 200ms;
    }
  }
  .motion-safe\:duration-280 {
    @media (prefers-reduced-motion: no-preference) {
      --tw-duration: 280ms;
      transition-duration: 280ms;
    }
  }
  .motion-safe\:duration-300 {
    @media (prefers-reduced-motion: no-preference) {
      --tw-duration: 300ms;
      transition-duration: 300ms;
    }
  }
  .motion-safe\:ease-ui {
    @media (prefers-reduced-motion: no-preference) {
      --tw-ease: var(--ease-ui);
      transition-timing-function: var(--ease-ui);
    }
  }
  .motion-safe\:group-hover\:scale-110 {
    @media (prefers-reduced-motion: no-preference) {
      &:is(:where(.group):hover *) {
        @media (hover: hover) {
          --tw-scale-x: 110%;
          --tw-scale-y: 110%;
          --tw-scale-z: 110%;
          scale: var(--tw-scale-x) var(--tw-scale-y);
        }
      }
    }
  }
  .motion-safe\:group-aria-expanded\:rotate-180 {
    @media (prefers-reduced-motion: no-preference) {
      &:is(:where(.group)[aria-expanded="true"] *) {
        rotate: 180deg;
      }
    }
  }
  .motion-safe\:hover\:-translate-y-0\.5 {
    @media (prefers-reduced-motion: no-preference) {
      &:hover {
        @media (hover: hover) {
          --tw-translate-y: calc(var(--spacing) * -0.5);
          translate: var(--tw-translate-x) var(--tw-translate-y);
        }
      }
    }
  }
  .motion-safe\:hover\:translate-y-1 {
    @media (prefers-reduced-motion: no-preference) {
      &:hover {
        @media (hover: hover) {
          --tw-translate-y: calc(var(--spacing) * 1);
          translate: var(--tw-translate-x) var(--tw-translate-y);
        }
      }
    }
  }
  .motion-safe\:hover\:-rotate-2 {
    @media (prefers-reduced-motion: no-preference) {
      &:hover {
        @media (hover: hover) {
          rotate: calc(2deg * -1);
        }
      }
    }
  }
  .motion-safe\:active\:translate-y-0 {
    @media (prefers-reduced-motion: no-preference) {
      &:active {
        --tw-translate-y: calc(var(--spacing) * 0);
        translate: var(--tw-translate-x) var(--tw-translate-y);
      }
    }
  }
  .motion-safe\:active\:scale-\[0\.90\] {
    @media (prefers-reduced-motion: no-preference) {
      &:active {
        scale: 0.90;
      }
    }
  }
  .motion-safe\:active\:scale-\[0\.95\] {
    @media (prefers-reduced-motion: no-preference) {
      &:active {
        scale: 0.95;
      }
    }
  }
  .motion-safe\:active\:scale-\[0\.97\] {
    @media (prefers-reduced-motion: no-preference) {
      &:active {
        scale: 0.97;
      }
    }
  }
  .motion-safe\:active\:scale-\[0\.98\] {
    @media (prefers-reduced-motion: no-preference) {
      &:active {
        scale: 0.98;
      }
    }
  }
  .motion-safe\:active\:scale-\[0\.99\] {
    @media (prefers-reduced-motion: no-preference) {
      &:active {
        scale: 0.99;
      }
    }
  }
  .max-md\:-mx-margin {
    @media (width < 48rem) {
      margin-inline: calc(var(--spacing-margin) * -1);
    }
  }
  .max-md\:block {
    @media (width < 48rem) {
      display: block;
    }
  }
  .max-md\:hidden {
    @media (width < 48rem) {
      display: none;
    }
  }
  .max-md\:shrink-0 {
    @media (width < 48rem) {
      flex-shrink: 0;
    }
  }
  .max-md\:snap-x {
    @media (width < 48rem) {
      scroll-snap-type: x var(--tw-scroll-snap-strictness);
    }
  }
  .max-md\:snap-start {
    @media (width < 48rem) {
      scroll-snap-align: start;
    }
  }
  .max-md\:\[scrollbar-width\:none\] {
    @media (width < 48rem) {
      scrollbar-width: none;
    }
  }
  .max-md\:flex-nowrap {
    @media (width < 48rem) {
      flex-wrap: nowrap;
    }
  }
  .max-md\:gap-5 {
    @media (width < 48rem) {
      gap: calc(var(--spacing) * 5);
    }
  }
  .max-md\:self-stretch {
    @media (width < 48rem) {
      align-self: stretch;
    }
  }
  .max-md\:overflow-x-auto {
    @media (width < 48rem) {
      overflow-x: auto;
    }
  }
  .max-md\:px-margin {
    @media (width < 48rem) {
      padding-inline: var(--spacing-margin);
    }
  }
  .max-md\:pb-1 {
    @media (width < 48rem) {
      padding-bottom: calc(var(--spacing) * 1);
    }
  }
  .max-md\:text-4xl {
    @media (width < 48rem) {
      font-size: var(--text-4xl);
      line-height: var(--tw-leading, var(--text-4xl--line-height));
    }
  }
  .max-md\:text-6xl {
    @media (width < 48rem) {
      font-size: var(--text-6xl);
      line-height: var(--tw-leading, var(--text-6xl--line-height));
    }
  }
  .max-md\:text-sm {
    @media (width < 48rem) {
      font-size: var(--text-sm);
      line-height: var(--tw-leading, var(--text-sm--line-height));
    }
  }
  .max-md\:leading-snug {
    @media (width < 48rem) {
      --tw-leading: var(--leading-snug);
      line-height: var(--leading-snug);
    }
  }
  .max-md\:whitespace-nowrap {
    @media (width < 48rem) {
      white-space: nowrap;
    }
  }
  .min-\[480px\]\:text-\[min\(3\.5em\,50cqw\)\] {
    @media (width >= 480px) {
      font-size: min(3.5em, 50cqw);
    }
  }
  .min-\[640px\]\:text-\[min\(5em\,50cqw\)\] {
    @media (width >= 640px) {
      font-size: min(5em, 50cqw);
    }
  }
  .min-\[760px\]\:grow {
    @media (width >= 760px) {
      flex-grow: 1;
    }
  }
  .min-\[760px\]\:grow-\[1\.5\] {
    @media (width >= 760px) {
      flex-grow: 1.5;
    }
  }
  .min-\[760px\]\:basis-0 {
    @media (width >= 760px) {
      flex-basis: calc(var(--spacing) * 0);
    }
  }
  .min-\[760px\]\:flex-row {
    @media (width >= 760px) {
      flex-direction: row;
    }
  }
  .min-\[760px\]\:items-center {
    @media (width >= 760px) {
      align-items: center;
    }
  }
  .min-\[760px\]\:gap-\[clamp\(40px\,5vw\,80px\)\] {
    @media (width >= 760px) {
      gap: clamp(40px, 5vw, 80px);
    }
  }
  .min-\[760px\]\:self-center {
    @media (width >= 760px) {
      align-self: center;
    }
  }
  .min-\[760px\]\:text-\[min\(4em\,50cqw\)\] {
    @media (width >= 760px) {
      font-size: min(4em, 50cqw);
    }
  }
  .min-\[760px\]\:has-\[\[data-aspect-ratio\=aspect-auto\]\]\:aspect-auto {
    @media (width >= 760px) {
      &:has(*:is([data-aspect-ratio=aspect-auto])) {
        aspect-ratio: auto;
      }
    }
  }
  .min-\[760px\]\:has-\[\[data-aspect-ratio\=aspect-auto\]\]\:min-h-\[360px\] {
    @media (width >= 760px) {
      &:has(*:is([data-aspect-ratio=aspect-auto])) {
        min-height: 360px;
      }
    }
  }
  .min-\[760px\]\:has-\[\[data-aspect-ratio\=aspect-auto\]\]\:self-stretch {
    @media (width >= 760px) {
      &:has(*:is([data-aspect-ratio=aspect-auto])) {
        align-self: stretch;
      }
    }
  }
  .min-\[960px\]\:text-\[min\(5\.5em\,50cqw\)\] {
    @media (width >= 960px) {
      font-size: min(5.5em, 50cqw);
    }
  }
  .min-\[1200px\]\:text-\[min\(6\.5em\,50cqw\)\] {
    @media (width >= 1200px) {
      font-size: min(6.5em, 50cqw);
    }
  }
  .min-\[1440px\]\:text-\[min\(8em\,50cqw\)\] {
    @media (width >= 1440px) {
      font-size: min(8em, 50cqw);
    }
  }
  .sm\:mb-7 {
    @media (width >= 40rem) {
      margin-bottom: calc(var(--spacing) * 7);
    }
  }
  .sm\:w-\[44\%\] {
    @media (width >= 40rem) {
      width: 44%;
    }
  }
  .sm\:w-\[82\%\] {
    @media (width >= 40rem) {
      width: 82%;
    }
  }
  .sm\:w-\[84px\] {
    @media (width >= 40rem) {
      width: 84px;
    }
  }
  .sm\:flex-row {
    @media (width >= 40rem) {
      flex-direction: row;
    }
  }
  .sm\:flex-wrap {
    @media (width >= 40rem) {
      flex-wrap: wrap;
    }
  }
  .sm\:items-center {
    @media (width >= 40rem) {
      align-items: center;
    }
  }
  .sm\:items-end {
    @media (width >= 40rem) {
      align-items: flex-end;
    }
  }
  .sm\:justify-between {
    @media (width >= 40rem) {
      justify-content: space-between;
    }
  }
  .sm\:gap-3 {
    @media (width >= 40rem) {
      gap: calc(var(--spacing) * 3);
    }
  }
  .sm\:gap-4 {
    @media (width >= 40rem) {
      gap: calc(var(--spacing) * 4);
    }
  }
  .sm\:gap-6 {
    @media (width >= 40rem) {
      gap: calc(var(--spacing) * 6);
    }
  }
  .sm\:p-8 {
    @media (width >= 40rem) {
      padding: calc(var(--spacing) * 8);
    }
  }
  .sm\:py-8 {
    @media (width >= 40rem) {
      padding-block: calc(var(--spacing) * 8);
    }
  }
  .sm\:text-end {
    @media (width >= 40rem) {
      text-align: end;
    }
  }
  .md\:sticky {
    @media (width >= 48rem) {
      position: sticky;
    }
  }
  .md\:top-24 {
    @media (width >= 48rem) {
      top: calc(var(--spacing) * 24);
    }
  }
  .md\:col-span-2 {
    @media (width >= 48rem) {
      grid-column: span 2 / span 2;
    }
  }
  .md\:col-span-3 {
    @media (width >= 48rem) {
      grid-column: span 3 / span 3;
    }
  }
  .md\:mx-0 {
    @media (width >= 48rem) {
      margin-inline: calc(var(--spacing) * 0);
    }
  }
  .md\:block {
    @media (width >= 48rem) {
      display: block;
    }
  }
  .md\:flex {
    @media (width >= 48rem) {
      display: flex;
    }
  }
  .md\:grid {
    @media (width >= 48rem) {
      display: grid;
    }
  }
  .md\:hidden {
    @media (width >= 48rem) {
      display: none;
    }
  }
  .md\:aspect-4\/5 {
    @media (width >= 48rem) {
      aspect-ratio: 4/5;
    }
  }
  .md\:min-h-16 {
    @media (width >= 48rem) {
      min-height: calc(var(--spacing) * 16);
    }
  }
  .md\:min-h-\[86svh\] {
    @media (width >= 48rem) {
      min-height: 86svh;
    }
  }
  .md\:w-auto {
    @media (width >= 48rem) {
      width: auto;
    }
  }
  .md\:translate-y-11 {
    @media (width >= 48rem) {
      --tw-translate-y: calc(var(--spacing) * 11);
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }
  }
  .md\:snap-none {
    @media (width >= 48rem) {
      scroll-snap-type: none;
    }
  }
  .md\:columns-3 {
    @media (width >= 48rem) {
      columns: 3;
    }
  }
  .md\:grid-cols-2 {
    @media (width >= 48rem) {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
  }
  .md\:grid-cols-4 {
    @media (width >= 48rem) {
      grid-template-columns: repeat(4, minmax(0, 1fr));
    }
  }
  .md\:grid-cols-5 {
    @media (width >= 48rem) {
      grid-template-columns: repeat(5, minmax(0, 1fr));
    }
  }
  .md\:flex-row {
    @media (width >= 48rem) {
      flex-direction: row;
    }
  }
  .md\:flex-wrap {
    @media (width >= 48rem) {
      flex-wrap: wrap;
    }
  }
  .md\:items-center {
    @media (width >= 48rem) {
      align-items: center;
    }
  }
  .md\:gap-3 {
    @media (width >= 48rem) {
      gap: calc(var(--spacing) * 3);
    }
  }
  .md\:gap-8 {
    @media (width >= 48rem) {
      gap: calc(var(--spacing) * 8);
    }
  }
  .md\:gap-12 {
    @media (width >= 48rem) {
      gap: calc(var(--spacing) * 12);
    }
  }
  .md\:gap-x-6 {
    @media (width >= 48rem) {
      column-gap: calc(var(--spacing) * 6);
    }
  }
  .md\:gap-x-8 {
    @media (width >= 48rem) {
      column-gap: calc(var(--spacing) * 8);
    }
  }
  .md\:gap-y-14 {
    @media (width >= 48rem) {
      row-gap: calc(var(--spacing) * 14);
    }
  }
  .md\:self-start {
    @media (width >= 48rem) {
      align-self: flex-start;
    }
  }
  .md\:overflow-visible {
    @media (width >= 48rem) {
      overflow: visible;
    }
  }
  .md\:rounded-3xl {
    @media (width >= 48rem) {
      border-radius: var(--radius-3xl);
    }
  }
  .md\:\!py-10 {
    @media (width >= 48rem) {
      padding-block: calc(var(--spacing) * 10) !important;
    }
  }
  .md\:\!py-12 {
    @media (width >= 48rem) {
      padding-block: calc(var(--spacing) * 12) !important;
    }
  }
  .md\:\!py-20 {
    @media (width >= 48rem) {
      padding-block: calc(var(--spacing) * 20) !important;
    }
  }
  .md\:py-0 {
    @media (width >= 48rem) {
      padding-block: calc(var(--spacing) * 0);
    }
  }
  .md\:py-2 {
    @media (width >= 48rem) {
      padding-block: calc(var(--spacing) * 2);
    }
  }
  .md\:py-24 {
    @media (width >= 48rem) {
      padding-block: calc(var(--spacing) * 24);
    }
  }
  .md\:pt-8 {
    @media (width >= 48rem) {
      padding-top: calc(var(--spacing) * 8);
    }
  }
  .md\:pt-24 {
    @media (width >= 48rem) {
      padding-top: calc(var(--spacing) * 24);
    }
  }
  .md\:pt-32 {
    @media (width >= 48rem) {
      padding-top: calc(var(--spacing) * 32);
    }
  }
  .md\:pb-14 {
    @media (width >= 48rem) {
      padding-bottom: calc(var(--spacing) * 14);
    }
  }
  .md\:pb-24 {
    @media (width >= 48rem) {
      padding-bottom: calc(var(--spacing) * 24);
    }
  }
  .md\:text-\[clamp\(4\.5rem\,9vw\,9\.5rem\)\] {
    @media (width >= 48rem) {
      font-size: clamp(4.5rem, 9vw, 9.5rem);
    }
  }
  .lg\:sticky {
    @media (width >= 64rem) {
      position: sticky;
    }
  }
  .lg\:top-8 {
    @media (width >= 64rem) {
      top: calc(var(--spacing) * 8);
    }
  }
  .lg\:order-1 {
    @media (width >= 64rem) {
      order: 1;
    }
  }
  .lg\:order-2 {
    @media (width >= 64rem) {
      order: 2;
    }
  }
  .lg\:col-span-2 {
    @media (width >= 64rem) {
      grid-column: span 2 / span 2;
    }
  }
  .lg\:col-span-3 {
    @media (width >= 64rem) {
      grid-column: span 3 / span 3;
    }
  }
  .lg\:mt-0 {
    @media (width >= 64rem) {
      margin-top: calc(var(--spacing) * 0);
    }
  }
  .lg\:grid {
    @media (width >= 64rem) {
      display: grid;
    }
  }
  .lg\:w-1\/4 {
    @media (width >= 64rem) {
      width: calc(1 / 4 * 100%);
    }
  }
  .lg\:columns-4 {
    @media (width >= 64rem) {
      columns: 4;
    }
  }
  .lg\:grid-cols-3 {
    @media (width >= 64rem) {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
  }
  .lg\:grid-cols-4 {
    @media (width >= 64rem) {
      grid-template-columns: repeat(4, minmax(0, 1fr));
    }
  }
  .lg\:grid-cols-5 {
    @media (width >= 64rem) {
      grid-template-columns: repeat(5, minmax(0, 1fr));
    }
  }
  .lg\:grid-cols-\[1fr_400px\] {
    @media (width >= 64rem) {
      grid-template-columns: 1fr 400px;
    }
  }
  .lg\:flex-row {
    @media (width >= 64rem) {
      flex-direction: row;
    }
  }
  .lg\:items-end {
    @media (width >= 64rem) {
      align-items: flex-end;
    }
  }
  .lg\:items-start {
    @media (width >= 64rem) {
      align-items: flex-start;
    }
  }
  .lg\:justify-between {
    @media (width >= 64rem) {
      justify-content: space-between;
    }
  }
  .lg\:gap-12 {
    @media (width >= 64rem) {
      gap: calc(var(--spacing) * 12);
    }
  }
  .lg\:p-8 {
    @media (width >= 64rem) {
      padding: calc(var(--spacing) * 8);
    }
  }
  .lg\:p-10 {
    @media (width >= 64rem) {
      padding: calc(var(--spacing) * 10);
    }
  }
  .lg\:px-14 {
    @media (width >= 64rem) {
      padding-inline: calc(var(--spacing) * 14);
    }
  }
  .lg\:group-has-\[figure_img\]\:min-h-svh {
    @media (width >= 64rem) {
      &:is(:where(.group):has(*:is(figure img)) *) {
        min-height: 100svh;
      }
    }
  }
  .lg\:group-has-\[figure_img\]\:max-w-none {
    @media (width >= 64rem) {
      &:is(:where(.group):has(*:is(figure img)) *) {
        max-width: none;
      }
    }
  }
  .lg\:has-\[figure_img\]\:grid-cols-\[53\%_47\%\] {
    @media (width >= 64rem) {
      &:has(*:is(figure img)) {
        grid-template-columns: 53% 47%;
      }
    }
  }
  .xl\:px-20 {
    @media (width >= 80rem) {
      padding-inline: calc(var(--spacing) * 20);
    }
  }
  .rtl\:-translate-x-1\/2 {
    &:where(:dir(rtl), [dir="rtl"], [dir="rtl"] *) {
      --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }
  }
  .rtl\:-scale-x-100 {
    &:where(:dir(rtl), [dir="rtl"], [dir="rtl"] *) {
      --tw-scale-x: calc(100% * -1);
      scale: var(--tw-scale-x) var(--tw-scale-y);
    }
  }
  .rtl\:transform-\[translateX\(-100\%\)\] {
    &:where(:dir(rtl), [dir="rtl"], [dir="rtl"] *) {
      transform: translateX(-100%);
    }
  }
  .rtl\:\[--panel-closed-transform\:translateX\(-100\%\)\] {
    &:where(:dir(rtl), [dir="rtl"], [dir="rtl"] *) {
      --panel-closed-transform: translateX(-100%);
    }
  }
  .rtl\:\[--panel-closed-transform\:translateX\(100\%\)\] {
    &:where(:dir(rtl), [dir="rtl"], [dir="rtl"] *) {
      --panel-closed-transform: translateX(100%);
    }
  }
  .starting\:\[transform\:translateY\(100\%\)\] {
    @starting-style {
      transform: translateY(100%);
    }
  }
  .starting\:opacity-0 {
    @starting-style {
      opacity: 0%;
    }
  }
  .\[\&_img\]\:max-w-full {
    & img {
      max-width: 100%;
    }
  }
  .\[\&_img\]\:object-contain {
    & img {
      object-fit: contain;
    }
  }
  .\[\&_img\]\:drop-shadow-\[0_6px_14px_rgba\(0\,0\,0\,0\.55\)\] {
    & img {
      --tw-drop-shadow-size: drop-shadow(0 6px 14px var(--tw-drop-shadow-color, rgba(0,0,0,0.55)));
      --tw-drop-shadow: var(--tw-drop-shadow-size);
      filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
    }
  }
  .\[\&_img\]\:invert {
    & img {
      --tw-invert: invert(100%);
      filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
    }
  }
  .max-md\:\[\&_img\]\:\!h-16 {
    @media (width < 48rem) {
      & img {
        height: calc(var(--spacing) * 16) !important;
      }
    }
  }
  .\[\&_span\]\:text-on-surface {
    & span {
      color: var(--color-on-surface);
    }
  }
  .\[\&_span\]\:text-on-surface-secondary {
    & span {
      color: var(--color-on-surface-secondary);
    }
  }
  .\[\&\:\:-webkit-details-marker\]\:hidden {
    &::-webkit-details-marker {
      display: none;
    }
  }
  .\[\&\:\:-webkit-inner-spin-button\]\:appearance-none {
    &::-webkit-inner-spin-button {
      appearance: none;
    }
  }
  .\[\&\:\:-webkit-outer-spin-button\]\:appearance-none {
    &::-webkit-outer-spin-button {
      appearance: none;
    }
  }
  .\[\&\:\:-webkit-scrollbar\]\:hidden {
    &::-webkit-scrollbar {
      display: none;
    }
  }
  .max-md\:\[\&\:\:-webkit-scrollbar\]\:hidden {
    @media (width < 48rem) {
      &::-webkit-scrollbar {
        display: none;
      }
    }
  }
  .\[\&\:\:-webkit-search-cancel-button\]\:hidden {
    &::-webkit-search-cancel-button {
      display: none;
    }
  }
  .\[\&\[data-aspect-ratio\=aspect-auto\]\]\:absolute {
    &[data-aspect-ratio=aspect-auto] {
      position: absolute;
    }
  }
  .\[\&\[data-aspect-ratio\=aspect-auto\]\]\:inset-0 {
    &[data-aspect-ratio=aspect-auto] {
      inset: calc(var(--spacing) * 0);
    }
  }
  .\[\&\[data-aspect-ratio\=aspect-auto\]\]\:h-full {
    &[data-aspect-ratio=aspect-auto] {
      height: 100%;
    }
  }
  .\[\:where\(\&\)\]\:fixed {
    :where(&) {
      position: fixed;
    }
  }
  .\[\:where\(\&\)\]\:inset-x-0 {
    :where(&) {
      inset-inline: calc(var(--spacing) * 0);
    }
  }
  .\[\:where\(\&\)\]\:inset-y-0 {
    :where(&) {
      inset-block: calc(var(--spacing) * 0);
    }
  }
  .\[\:where\(\&\)\]\:inset-s-0 {
    :where(&) {
      inset-inline-start: calc(var(--spacing) * 0);
    }
  }
  .\[\:where\(\&\)\]\:inset-s-auto {
    :where(&) {
      inset-inline-start: auto;
    }
  }
  .\[\:where\(\&\)\]\:inset-e-0 {
    :where(&) {
      inset-inline-end: calc(var(--spacing) * 0);
    }
  }
  .\[\:where\(\&\)\]\:inset-e-auto {
    :where(&) {
      inset-inline-end: auto;
    }
  }
  .\[\:where\(\&\)\]\:inset-bs-auto {
    :where(&) {
      inset-block-start: auto;
    }
  }
  .\[\:where\(\&\)\]\:inset-be-0 {
    :where(&) {
      inset-block-end: calc(var(--spacing) * 0);
    }
  }
  .\[\:where\(\&\)\]\:h-full {
    :where(&) {
      height: 100%;
    }
  }
  .\[\:where\(\&\)\]\:max-h-dialog-max-height {
    :where(&) {
      max-height: var(--spacing-dialog-max-height);
    }
  }
  .\[\:where\(\&\)\]\:w-full {
    :where(&) {
      width: 100%;
    }
  }
  .\[\:where\(\&\)\]\:w-screen {
    :where(&) {
      width: 100vw;
    }
  }
  .\[\:where\(\&\)\]\:rounded-t-lg {
    :where(&) {
      border-top-left-radius: var(--radius-lg);
      border-top-right-radius: var(--radius-lg);
    }
  }
  .\[\:where\(\&\)\]\:rounded-b-none {
    :where(&) {
      border-bottom-right-radius: 0;
      border-bottom-left-radius: 0;
    }
  }
  .\[\:where\(\&\)\]\:ps-\(--safe-area-inset-inline-start\) {
    :where(&) {
      padding-inline-start: var(--safe-area-inset-inline-start);
    }
  }
  .\[\:where\(\&\)\]\:ps-0 {
    :where(&) {
      padding-inline-start: calc(var(--spacing) * 0);
    }
  }
  .\[\:where\(\&\)\]\:pe-\(--safe-area-inset-inline-end\) {
    :where(&) {
      padding-inline-end: var(--safe-area-inset-inline-end);
    }
  }
  .\[\:where\(\&\)\]\:pe-0 {
    :where(&) {
      padding-inline-end: calc(var(--spacing) * 0);
    }
  }
  .\[\:where\(\&\)\]\:pt-\(--safe-area-inset-top\) {
    :where(&) {
      padding-top: var(--safe-area-inset-top);
    }
  }
  .\[\:where\(\&\)\]\:pb-\(--safe-area-inset-bottom\) {
    :where(&) {
      padding-bottom: var(--safe-area-inset-bottom);
    }
  }
  .min-\[480px\]\:\[\:where\(\&\)\]\:w-drawer-width {
    @media (width >= 480px) {
      :where(&) {
        width: var(--spacing-drawer-width);
      }
    }
  }
}
:root {
  --safe-area-inset-top: env(safe-area-inset-top, 0px);
  --safe-area-inset-right: env(safe-area-inset-right, 0px);
  --safe-area-inset-bottom: env(safe-area-inset-bottom, 0px);
  --safe-area-inset-left: env(safe-area-inset-left, 0px);
  --safe-area-inset-inline: max(var(--safe-area-inset-left), var(--safe-area-inset-right));
  --safe-area-inset-inline-start: var(--safe-area-inset-left);
  --safe-area-inset-inline-end: var(--safe-area-inset-right);
}
[dir="rtl"] {
  --safe-area-inset-inline-start: var(--safe-area-inset-right);
  --safe-area-inset-inline-end: var(--safe-area-inset-left);
}
@layer components {
  .placeholder-texture {
    background-color: var(--color-surface-secondary);
    background-image: radial-gradient( ellipse 90% 82% at var(--placeholder-accent-x) var(--placeholder-accent-y), color-mix(in srgb, #2563eb 44%, #ffffff) 0%, transparent 76% ), linear-gradient( var(--placeholder-angle), color-mix(in srgb, #2563eb 10%, #ffffff) 0%, color-mix(in srgb, #171717 22%, #ffffff) 100% );
    @supports (color: color-mix(in lab, red, red)) {
      background-image: radial-gradient( ellipse 90% 82% at var(--placeholder-accent-x) var(--placeholder-accent-y), color-mix(in oklab, var(--color-accent) 44%, var(--color-surface)) 0%, transparent 76% ), linear-gradient( var(--placeholder-angle), color-mix(in oklab, var(--color-accent) 10%, var(--color-surface)) 0%, color-mix(in oklab, var(--color-on-surface) 22%, var(--color-surface)) 100% );
    }
    background-position: center, center;
    background-repeat: no-repeat;
    background-size: 100% 100%, 140% 140%;
  }
}
@layer base {
  .placeholder-texture {
    aspect-ratio: 1;
  }
}
@layer components {
  .swatch-sm {
    width: 1.5rem;
    height: 1.5rem;
  }
  .swatch-md {
    width: 2rem;
    height: 2rem;
  }
  .swatch-lg {
    width: 2.5rem;
    height: 2.5rem;
  }
  .button-primary {
    background: var(--color-button-primary);
    color: var(--color-button-primary-text);
    @media (hover: hover) {
      &:hover {
        background: color-mix(in srgb, #171717 85%, black);
        @supports (color: color-mix(in lab, red, red)) {
          background: color-mix(in oklab, var(--color-button-primary) 85%, black);
        }
      }
    }
  }
  .button-secondary {
    background: var(--color-button-secondary);
    color: var(--color-button-secondary-text);
    border: 1px solid var(--color-border);
    @media (hover: hover) {
      &:hover {
        background: color-mix(in srgb, #3b2e49 90%, black);
        @supports (color: color-mix(in lab, red, red)) {
          background: color-mix(in oklab, var(--color-button-secondary) 90%, black);
        }
        border-color: color-mix(in srgb, #3b2e49 90%, black);
        @supports (color: color-mix(in lab, red, red)) {
          border-color: color-mix(in oklab, var(--color-button-secondary) 90%, black);
        }
      }
    }
  }
  .button-outline {
    background: transparent;
    color: var(--color-button-outline-text);
    border: 2px solid var(--color-button-outline-border);
    @media (hover: hover) {
      &:hover {
        background: var(--color-surface-secondary);
      }
    }
  }
  .button-ghost {
    background: transparent;
    color: var(--color-on-surface);
    @media (hover: hover) {
      &:hover {
        background: var(--color-surface-secondary);
      }
    }
  }
  .button-surface {
    background: var(--color-surface);
    color: var(--color-on-surface);
    @media (hover: hover) {
      &:hover {
        background: color-mix(in srgb, #ffffff 90%, transparent);
        @supports (color: color-mix(in lab, red, red)) {
          background: color-mix(in oklab, var(--color-surface) 90%, transparent);
        }
      }
    }
  }
  .quantity-selector-outlined {
    border: 1px solid var(--color-border);
    background: transparent;
  }
  .quantity-selector-filled {
    background: var(--color-surface-secondary);
    border: 1px solid transparent;
  }
}
@layer base {
  body {
    text-wrap: pretty;
  }
  :where(h1, h2, h3, h4, h5, h6) {
    text-wrap: balance;
  }
  ul:not([class]) {
    list-style: disc;
    padding-inline-start: 1.5rem;
  }
  ol:not([class]) {
    list-style: decimal;
    padding-inline-start: 1.5rem;
  }
  :where(ul, ol):not([class]) {
    margin-block: 1rem;
  }
  li:not([class]) {
    margin-block: 0.25rem;
  }
  p:not([class]) {
    margin-block: 1rem;
  }
  :where(strong, b):not([class]) {
    font-weight: 700;
  }
  :where(em, i):not([class]) {
    font-style: italic;
  }
  a:not([class]) {
    color: var(--color-accent);
    text-decoration: underline;
    text-underline-offset: 2px;
  }
}
@layer components {
  .richtext {
    display: block;
    --tw-leading: var(--leading-relaxed);
    line-height: var(--leading-relaxed);
    color: var(--color-on-surface);
    h1, h2, h3, h4, h5, h6 {
      font-family: var(--font-heading);
      --tw-leading: var(--leading-tight);
      line-height: var(--leading-tight);
      --tw-font-weight: var(--font-weight-bold);
      font-weight: var(--font-weight-bold);
      color: var(--color-on-surface);
    }
    h1 {
      margin-top: calc(var(--spacing) * 8);
      margin-bottom: calc(var(--spacing) * 4);
      font-size: var(--text-4xl);
      line-height: var(--tw-leading, var(--text-4xl--line-height));
    }
    h2 {
      margin-top: calc(var(--spacing) * 8);
      margin-bottom: calc(var(--spacing) * 3);
      font-size: var(--text-3xl);
      line-height: var(--tw-leading, var(--text-3xl--line-height));
    }
    h3 {
      margin-top: calc(var(--spacing) * 6);
      margin-bottom: calc(var(--spacing) * 3);
      font-size: var(--text-2xl);
      line-height: var(--tw-leading, var(--text-2xl--line-height));
    }
    h4 {
      margin-top: calc(var(--spacing) * 6);
      margin-bottom: calc(var(--spacing) * 2);
      font-size: var(--text-xl);
      line-height: var(--tw-leading, var(--text-xl--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));
    }
    p {
      margin-bottom: calc(var(--spacing) * 4);
    }
    strong, b {
      font-weight: 700;
    }
    :where(h1, h2, h3, h4, h5, h6) :where(strong, b) {
      font-weight: 800;
    }
    em, i {
      font-style: italic;
    }
    ul {
      margin-bottom: calc(var(--spacing) * 4);
      list-style-type: disc;
      :where(& > :not(:last-child)) {
        --tw-space-y-reverse: 0;
        margin-block-start: calc(calc(var(--spacing) * 1) * var(--tw-space-y-reverse));
        margin-block-end: calc(calc(var(--spacing) * 1) * calc(1 - var(--tw-space-y-reverse)));
      }
      padding-inline-start: calc(var(--spacing) * 6);
    }
    ol {
      margin-bottom: calc(var(--spacing) * 4);
      list-style-type: decimal;
      :where(& > :not(:last-child)) {
        --tw-space-y-reverse: 0;
        margin-block-start: calc(calc(var(--spacing) * 1) * var(--tw-space-y-reverse));
        margin-block-end: calc(calc(var(--spacing) * 1) * calc(1 - var(--tw-space-y-reverse)));
      }
      padding-inline-start: calc(var(--spacing) * 6);
    }
    li {
      color: var(--color-on-surface);
    }
    a {
      color: var(--color-accent);
      text-decoration-line: underline;
      text-underline-offset: 2px;
      @media (hover: hover) {
        &:hover {
          opacity: 80%;
        }
      }
    }
    blockquote {
      margin-block: calc(var(--spacing) * 6);
      border-inline-start-style: var(--tw-border-style);
      border-inline-start-width: 4px;
      border-color: var(--color-border);
      padding-inline-start: calc(var(--spacing) * 4);
      color: var(--color-on-surface-secondary);
      font-style: italic;
    }
    img {
      margin-block: calc(var(--spacing) * 4);
      height: auto;
      max-width: 100%;
      border-radius: var(--radius);
    }
    table {
      margin-bottom: calc(var(--spacing) * 4);
      width: 100%;
      border-collapse: collapse;
      th {
        border-bottom-style: var(--tw-border-style);
        border-bottom-width: 1px;
        border-color: var(--color-border);
        background-color: var(--color-surface-secondary);
        padding-inline: calc(var(--spacing) * 3);
        padding-block: calc(var(--spacing) * 2);
        text-align: start;
        --tw-font-weight: var(--font-weight-semibold);
        font-weight: var(--font-weight-semibold);
      }
      td {
        border-bottom-style: var(--tw-border-style);
        border-bottom-width: 1px;
        border-color: var(--color-border);
        padding-inline: calc(var(--spacing) * 3);
        padding-block: calc(var(--spacing) * 2);
      }
      tr:last-child td {
        border-bottom-style: var(--tw-border-style);
        border-bottom-width: 0px;
      }
    }
    hr {
      margin-block: calc(var(--spacing) * 8);
      border-style: var(--tw-border-style);
      border-width: 0px;
      border-top-style: var(--tw-border-style);
      border-top-width: 1px;
      border-color: var(--color-border);
    }
    > *:first-child {
      margin-top: calc(var(--spacing) * 0);
    }
    > *:last-child {
      margin-bottom: calc(var(--spacing) * 0);
    }
  }
}
@layer base {
  html:has(dialog:modal) {
    overflow: hidden;
  }
}
@layer components {
  .overlay-panel {
    border: none;
    padding: 0;
    margin: 0;
    max-width: none;
    max-height: none;
    overflow: hidden;
    overscroll-behavior: contain;
    background: var(--color-surface);
    box-shadow: var(--shadow-xl);
    opacity: 0;
    transform: var(--panel-closed-transform, none);
    transition: opacity 0.2s var(--ease-drawer), transform 0.2s var(--ease-drawer), display 0.2s allow-discrete, overlay 0.2s allow-discrete;
    &[open] {
      opacity: 1;
      transform: none;
      transition: opacity 0.3s var(--ease-drawer), transform 0.3s var(--ease-drawer), display 0.3s allow-discrete, overlay 0.3s allow-discrete;
    }
    &::backdrop {
      background: rgb(0 0 0 / 0);
      transition: background 0.2s var(--ease-drawer), display 0.2s allow-discrete, overlay 0.2s allow-discrete;
    }
    &[open]::backdrop {
      background: var(--panel-backdrop, rgb(0 0 0 / 0.5));
      transition: background 0.3s var(--ease-drawer), display 0.3s allow-discrete, overlay 0.3s allow-discrete;
    }
    @starting-style {
      &[open] {
        opacity: 0;
        transform: var(--panel-closed-transform, none);
      }
      &[open]::backdrop {
        background: rgb(0 0 0 / 0);
      }
    }
    @media (prefers-reduced-motion: reduce) {
      transition-duration: 0s;
      &[open] {
        transition-duration: 0s;
      }
      &::backdrop {
        transition-duration: 0s;
      }
      &[open]::backdrop {
        transition-duration: 0s;
      }
    }
  }
}
@layer utilities {
  @media (max-width: 47.999rem) {
    #predictive-search {
      width: 100vw;
      height: 100dvh;
      max-height: 100dvh;
      margin: 0;
      border-radius: 0;
      inset: 0;
      padding: var(--safe-area-inset-top) var(--safe-area-inset-right) var(--safe-area-inset-bottom) var(--safe-area-inset-left);
    }
    #predictive-search [data-dialog-body] {
      height: 100%;
      max-height: none;
    }
    #predictive-search [data-fade-overlay] {
      position: fixed;
      bottom: 0;
      inset-inline: 0;
      z-index: 10;
      padding-block-end: calc(1rem + var(--safe-area-inset-bottom));
      padding-inline-start: calc(1rem + var(--safe-area-inset-inline-start));
      padding-inline-end: calc(1rem + var(--safe-area-inset-inline-end));
    }
  }
  #predictive-search [data-fade-overlay] {
    z-index: 10;
  }
  @media (min-width: 48rem) {
    #predictive-search {
      margin: auto;
    }
  }
}
@layer base {
  [role="option"] {
    @media (prefers-reduced-motion: no-preference) {
      transition: background-color 0.15s var(--ease-ui), color 0.15s var(--ease-ui);
    }
  }
  [role="option"][aria-selected="true"] {
    background-color: var(--color-surface-secondary);
    outline: 2px solid var(--color-accent);
    outline-offset: -2px;
    border-radius: var(--radius-sm);
  }
}
@layer base {
  [popover] {
    border: none;
    padding: 0;
    margin: 0;
    overflow: visible;
    background: transparent;
    opacity: 0;
    transform: translateY(4px);
    transform-origin: var(--popover-origin, center);
    transition: opacity 0.1s var(--ease-ui), transform 0.1s var(--ease-ui), display 0.1s allow-discrete, overlay 0.1s allow-discrete;
  }
  [popover]:popover-open {
    opacity: 1;
    transform: translateY(0);
    transition: opacity 0.15s var(--ease-ui), transform 0.15s var(--ease-ui), display 0.15s allow-discrete, overlay 0.15s allow-discrete;
  }
  @starting-style {
    [popover]:popover-open {
      opacity: 0;
      transform: translateY(4px);
    }
  }
  @media (prefers-reduced-motion: reduce) {
    [popover] {
      transition-duration: 0s;
    }
    [popover]:popover-open {
      transition-duration: 0s;
    }
  }
}
@layer base {
  input[type="text"], input[type="email"], input[type="password"], input[type="search"], input[type="tel"], input[type="url"], input[type="number"], input[type="date"], textarea, select {
    width: 100%;
    border-radius: var(--radius-input);
    background-color: var(--color-surface);
    color: var(--color-on-surface);
    padding: 0.375rem 0.75rem;
    border: 1px solid var(--color-border);
    font-family: var(--font-body);
    font-size: var(--text-sm);
    line-height: 1.5;
    appearance: none;
    @media (prefers-reduced-motion: no-preference) {
      transition: border-color 0.15s var(--ease-ui), box-shadow 0.15s var(--ease-ui);
    }
    &::placeholder {
      color: var(--color-on-surface-secondary);
    }
    &:focus-visible {
      outline: 2px solid var(--color-interactive);
      outline-offset: 2px;
    }
    &:disabled {
      cursor: not-allowed;
      background-color: var(--color-surface-secondary);
      opacity: 50%;
    }
    &[aria-invalid="true"] {
      border-color: var(--color-critical);
      box-shadow: 0 0 0 3px color-mix(in srgb, #ff6b81 15%, transparent);
      @supports (color: color-mix(in lab, red, red)) {
        box-shadow: 0 0 0 3px color-mix(in oklab, var(--color-critical) 15%, transparent);
      }
    }
  }
}
@layer base {
  :where(.button-primary, .button-secondary, .button-outline, .button-ghost, .button-surface) {
    padding: 0.375rem 0.75rem;
    font-size: 0.875rem;
  }
}
@layer base {
  select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.75rem center;
    background-size: 1rem;
    padding-inline-end: 2.5rem;
  }
  [dir="rtl"] select {
    background-position: left 0.75rem center;
  }
}
@layer components {
  .remove-icon-top, .remove-icon-bottom {
    transition: transform 125ms var(--ease-ui);
  }
  @media (hover: hover) {
    [command="--remove"]:hover .remove-icon-top {
      transform: translate(-0.5px, -2px) rotate(-15deg);
      transform-origin: 60% 50%;
    }
    [command="--remove"]:hover .remove-icon-bottom {
      transform: translateY(0.75px);
    }
  }
}
@layer base {
  textarea {
    resize: vertical;
    min-height: 6rem;
  }
}
@layer base {
  s-video, s-predictive-search, s-cart, s-live-form, s-localization-dropdown, s-mobile-nav, s-variant-picker, s-product-image-zoom {
    display: block;
  }
}
@layer base {
  s-video {
    position: relative;
  }
  s-video iframe, s-video video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
  }
}
@layer base {
  @media (min-width: 48rem) {
    :root {
      --spacing-margin: max(2.5rem, var(--safe-area-inset-inline));
    }
  }
}
@layer utilities {
  [data-header-nav-group] {
    padding-inline: var(--spacing-margin);
  }
}
@layer components {
  .stagger-fade-in {
    & > * {
      animation: none;
    }
    & > *:nth-child(n+2):nth-child(-n+9) {
      animation: stagger-item 0.4s var(--ease-ui) both;
    }
    & > *:nth-child(2) {
      animation-delay: 0ms;
    }
    & > *:nth-child(3) {
      animation-delay: 50ms;
    }
    & > *:nth-child(4) {
      animation-delay: 100ms;
    }
    & > *:nth-child(5) {
      animation-delay: 150ms;
    }
    & > *:nth-child(6) {
      animation-delay: 200ms;
    }
    & > *:nth-child(7) {
      animation-delay: 250ms;
    }
    & > *:nth-child(8) {
      animation-delay: 300ms;
    }
    & > *:nth-child(9) {
      animation-delay: 350ms;
    }
    @media (min-width: 48rem) {
      & > *:nth-child(n+1):nth-child(-n+2) {
        animation: none;
      }
      & > *:nth-child(n+3):nth-child(-n+10) {
        animation: stagger-item 0.4s var(--ease-ui) both;
      }
      & > *:nth-child(3) {
        animation-delay: 0ms;
      }
      & > *:nth-child(4) {
        animation-delay: 50ms;
      }
      & > *:nth-child(5) {
        animation-delay: 100ms;
      }
      & > *:nth-child(6) {
        animation-delay: 150ms;
      }
      & > *:nth-child(7) {
        animation-delay: 200ms;
      }
      & > *:nth-child(8) {
        animation-delay: 250ms;
      }
      & > *:nth-child(9) {
        animation-delay: 300ms;
      }
      & > *:nth-child(10) {
        animation-delay: 350ms;
      }
    }
    @media (min-width: 64rem) {
      &.lg\:grid-cols-3 > *:nth-child(n+1):nth-child(-n+3) {
        animation: none;
      }
      &.lg\:grid-cols-3 > *:nth-child(n+4):nth-child(-n+11) {
        animation: stagger-item 0.4s var(--ease-ui) both;
      }
      &.lg\:grid-cols-3 > *:nth-child(4) {
        animation-delay: 0ms;
      }
      &.lg\:grid-cols-3 > *:nth-child(5) {
        animation-delay: 50ms;
      }
      &.lg\:grid-cols-3 > *:nth-child(6) {
        animation-delay: 100ms;
      }
      &.lg\:grid-cols-3 > *:nth-child(7) {
        animation-delay: 150ms;
      }
      &.lg\:grid-cols-3 > *:nth-child(8) {
        animation-delay: 200ms;
      }
      &.lg\:grid-cols-3 > *:nth-child(9) {
        animation-delay: 250ms;
      }
      &.lg\:grid-cols-3 > *:nth-child(10) {
        animation-delay: 300ms;
      }
      &.lg\:grid-cols-3 > *:nth-child(11) {
        animation-delay: 350ms;
      }
      &.lg\:grid-cols-4 > *:nth-child(n+1):nth-child(-n+4) {
        animation: none;
      }
      &.lg\:grid-cols-4 > *:nth-child(n+5):nth-child(-n+12) {
        animation: stagger-item 0.4s var(--ease-ui) both;
      }
      &.lg\:grid-cols-4 > *:nth-child(5) {
        animation-delay: 0ms;
      }
      &.lg\:grid-cols-4 > *:nth-child(6) {
        animation-delay: 50ms;
      }
      &.lg\:grid-cols-4 > *:nth-child(7) {
        animation-delay: 100ms;
      }
      &.lg\:grid-cols-4 > *:nth-child(8) {
        animation-delay: 150ms;
      }
      &.lg\:grid-cols-4 > *:nth-child(9) {
        animation-delay: 200ms;
      }
      &.lg\:grid-cols-4 > *:nth-child(10) {
        animation-delay: 250ms;
      }
      &.lg\:grid-cols-4 > *:nth-child(11) {
        animation-delay: 300ms;
      }
      &.lg\:grid-cols-4 > *:nth-child(12) {
        animation-delay: 350ms;
      }
    }
    [data-stagger-settled] & > * {
      animation: none !important;
    }
  }
}
@keyframes stagger-item {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes motion-rise-in {
  from {
    opacity: 0;
    transform: translateY(24px) scale(0.98);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}
@keyframes motion-drop-in {
  from {
    opacity: 0;
    transform: translateY(-100%);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes motion-drift-loop {
  from {
    transform: scale(1) translate3d(0, 0, 0);
  }
  to {
    transform: scale(1.08) translate3d(-1.5%, -1%, 0);
  }
}
@keyframes motion-float-loop {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-10px);
  }
}
@keyframes motion-sway-loop {
  0%, 100% {
    rotate: -1.6deg;
  }
  50% {
    rotate: 1.6deg;
  }
}
@layer components {
  @media (prefers-reduced-motion: no-preference) {
    .motion-rise > * {
      animation: motion-rise-in 0.7s var(--ease-ui) both;
    }
    .motion-rise > *:nth-child(2) {
      animation-delay: 120ms;
    }
    .motion-rise > *:nth-child(3) {
      animation-delay: 240ms;
    }
    .motion-rise > *:nth-child(4) {
      animation-delay: 360ms;
    }
    .motion-drop {
      animation: motion-drop-in 0.5s var(--ease-drawer) both;
    }
    .motion-drift > img {
      animation: motion-drift-loop 24s ease-in-out infinite alternate;
      will-change: transform;
    }
    .motion-float {
      animation: motion-float-loop 6s ease-in-out infinite;
    }
    .motion-sway > * {
      transform-origin: 50% 0;
      animation: motion-sway-loop 5.5s ease-in-out infinite;
    }
    .motion-sway > *:nth-child(3n+2) {
      animation-duration: 6.4s;
      animation-delay: -2.1s;
    }
    .motion-sway > *:nth-child(3n+3) {
      animation-duration: 4.9s;
      animation-delay: -3.7s;
    }
    .motion-sway > *:hover, .motion-sway > *:focus-within {
      animation-play-state: paused;
    }
    .motion-lift {
      transition: translate 300ms var(--ease-ui), scale 150ms var(--ease-ui), box-shadow 300ms var(--ease-ui);
    }
    @media (hover: hover) {
      .motion-lift:hover {
        translate: 0 -6px;
        box-shadow: var(--shadow-xl);
      }
    }
    .motion-lift:active {
      translate: 0 -2px;
      scale: 0.99;
    }
    @supports (animation-timeline: view()) {
      .motion-reveal {
        animation: motion-rise-in linear both;
        animation-timeline: view();
        animation-range: entry 0% entry 60%;
      }
      .motion-reveal-stagger > * {
        animation: motion-rise-in linear both;
        animation-timeline: view();
        animation-range: entry 0% entry 55%;
      }
      .motion-reveal-stagger > *:nth-child(2) {
        animation-range: entry 10% entry 70%;
      }
      .motion-reveal-stagger > *:nth-child(3) {
        animation-range: entry 20% entry 85%;
      }
      .motion-reveal-stagger > *:nth-child(4) {
        animation-range: entry 25% entry 95%;
      }
    }
  }
}
@keyframes haunt-wave {
  0%, 100% {
    translate: 0 0;
    rotate: 0deg;
  }
  30% {
    translate: 0 -0.14em;
    rotate: -4deg;
  }
  65% {
    translate: 0 0.04em;
    rotate: 3deg;
  }
}
@keyframes haunt-flicker {
  0%, 100% {
    text-shadow: 0 0 0.12em var(--color-interactive), 0 0 0.45em color-mix(in srgb, var(--color-interactive) 55%, transparent);
  }
  42% {
    text-shadow: 0 0 0.04em var(--color-interactive), 0 0 0.15em color-mix(in srgb, var(--color-interactive) 25%, transparent);
  }
  46% {
    text-shadow: 0 0 0.2em var(--color-interactive), 0 0 0.7em color-mix(in srgb, var(--color-interactive) 70%, transparent);
  }
}
@layer components {
  .haunt-word {
    display: inline-block;
    white-space: nowrap;
  }
  .haunt-ch {
    display: inline-block;
  }
  @media (prefers-reduced-motion: no-preference) and (hover: hover) {
    .haunt-heading {
      cursor: default;
    }
    .haunt-ch {
      transition: color 250ms var(--ease-ui), scale 200ms var(--ease-ui), translate 250ms var(--ease-ui);
    }
    .haunt-heading:hover .haunt-ch {
      color: var(--color-interactive);
      animation: haunt-wave 1.6s ease-in-out infinite, haunt-flicker 2.4s ease-in-out infinite;
      animation-delay: calc(var(--i, 0) * 70ms), calc(var(--i, 0) * 70ms);
    }
    .haunt-heading .haunt-ch:hover {
      scale: 1.35;
      animation-play-state: paused;
      text-shadow: 0 0 0.25em var(--color-interactive), 0 0 0.8em var(--color-interactive);
    }
  }
}
@layer components {
  @media (prefers-reduced-motion: no-preference) {
    .haunt-glow {
      transition: translate 250ms var(--ease-ui), scale 120ms var(--ease-ui), box-shadow 250ms var(--ease-ui), color 250ms var(--ease-ui), border-color 250ms var(--ease-ui);
    }
    .haunt-glow:active {
      scale: 0.97;
    }
  }
  @media (prefers-reduced-motion: no-preference) and (hover: hover) {
    .haunt-glow:hover {
      translate: 0 -3px;
      color: var(--color-interactive);
      border-color: var(--color-interactive);
      box-shadow: 0 0 0.6rem color-mix(in srgb, #171717 60%, transparent), 0 0 1.6rem color-mix(in srgb, #171717 35%, transparent);
      @supports (color: color-mix(in lab, red, red)) {
        box-shadow: 0 0 0.6rem color-mix(in srgb, var(--color-interactive) 60%, transparent), 0 0 1.6rem color-mix(in srgb, var(--color-interactive) 35%, transparent);
      }
      animation: haunt-flicker 2.4s ease-in-out infinite;
    }
  }
}
@keyframes fog-drift {
  from {
    background-position: 0% 50%, 100% 40%, 30% 60%;
  }
  to {
    background-position: 100% 50%, 0% 40%, 130% 60%;
  }
}
@keyframes fog-conceal {
  0% {
    opacity: 0;
    scale: 1 0.7;
  }
  45% {
    opacity: 1;
    scale: 1 1.15;
  }
  60% {
    opacity: 1;
    scale: 1 1.15;
  }
  100% {
    opacity: 0;
    scale: 1 0.8;
  }
}
@layer components {
  .crypt-fog {
    --fog: color-mix(in srgb, #ffffff 55%, #000);
    @supports (color: color-mix(in lab, red, red)) {
      --fog: color-mix(in srgb, var(--color-surface) 55%, #000);
    }
    position: relative;
    z-index: 20;
    height: 0;
    pointer-events: none;
  }
  .crypt-fog__band {
    position: absolute;
    inset-inline: 0;
    top: -35vh;
    height: 70vh;
    overflow: hidden;
    opacity: 0.55;
    -webkit-mask-image: linear-gradient(to bottom, transparent 0%, #000 30%, #000 70%, transparent 100%);
    mask-image: linear-gradient(to bottom, transparent 0%, #000 30%, #000 70%, transparent 100%);
  }
  .crypt-fog__layer {
    position: absolute;
    inset: -20% -10%;
    filter: blur(28px);
    background-repeat: repeat-x;
    background-image: radial-gradient(ellipse 22% 38% at 50% 50%, var(--fog) 0%, transparent 70%), radial-gradient(ellipse 30% 30% at 50% 50%, var(--fog) 0%, transparent 72%), radial-gradient(ellipse 18% 45% at 50% 50%, var(--fog) 0%, transparent 70%);
    @supports (color: color-mix(in lab, red, red)) {
      background-image: radial-gradient(ellipse 22% 38% at 50% 50%, var(--fog) 0%, transparent 70%), radial-gradient(ellipse 30% 30% at 50% 50%, color-mix(in srgb, var(--fog) 85%, transparent) 0%, transparent 72%), radial-gradient(ellipse 18% 45% at 50% 50%, color-mix(in srgb, var(--fog) 70%, #000) 0%, transparent 70%);
    }
    background-size: 60% 100%, 75% 90%, 50% 110%;
    background-position: 0% 50%, 100% 40%, 30% 60%;
  }
  .crypt-fog__layer--back {
    opacity: 0.9;
  }
  .crypt-fog__layer--front {
    opacity: 0.75;
    filter: blur(40px);
    background-size: 45% 120%, 65% 80%, 40% 100%;
  }
  .crypt-fog__wall {
    display: none;
    position: absolute;
    inset-inline: 0;
    top: 25%;
    height: 50%;
    background: var(--fog);
    filter: blur(24px);
  }
  @media (prefers-reduced-motion: no-preference) {
    .crypt-fog__layer--back {
      animation: fog-drift 38s ease-in-out infinite alternate;
    }
    .crypt-fog__layer--front {
      animation: fog-drift 24s ease-in-out infinite alternate-reverse;
    }
    @supports (animation-timeline: view()) {
      .crypt-fog__band {
        opacity: 1;
        animation: fog-conceal linear both;
        animation-timeline: view();
        animation-range: cover 0% cover 100%;
      }
      .crypt-fog__wall {
        display: block;
      }
    }
  }
}
@keyframes drift-a {
  0% {
    translate: 0 0;
    rotate: -6deg;
  }
  20% {
    translate: 16vw -9vh;
    rotate: 5deg;
  }
  45% {
    translate: 6vw 16vh;
    rotate: 9deg;
  }
  70% {
    translate: -15vw 6vh;
    rotate: -4deg;
  }
  100% {
    translate: 0 0;
    rotate: -6deg;
  }
}
@keyframes drift-b {
  0% {
    translate: 0 0;
    rotate: 7deg;
  }
  25% {
    translate: -17vw 8vh;
    rotate: -5deg;
  }
  55% {
    translate: -4vw -15vh;
    rotate: -10deg;
  }
  80% {
    translate: 12vw -3vh;
    rotate: 4deg;
  }
  100% {
    translate: 0 0;
    rotate: 7deg;
  }
}
@keyframes drift-c {
  0% {
    translate: 0 0;
    rotate: 0deg;
  }
  20% {
    translate: 11vw 14vh;
    rotate: -8deg;
  }
  50% {
    translate: 19vw -8vh;
    rotate: 6deg;
  }
  75% {
    translate: -10vw -12vh;
    rotate: 10deg;
  }
  100% {
    translate: 0 0;
    rotate: 0deg;
  }
}
@keyframes drift-d {
  0% {
    translate: 0 0;
    rotate: 3deg;
  }
  15% {
    translate: -9vw -12vh;
    rotate: -7deg;
  }
  40% {
    translate: 14vw -16vh;
    rotate: 8deg;
  }
  65% {
    translate: 18vw 10vh;
    rotate: -3deg;
  }
  85% {
    translate: -12vw 12vh;
    rotate: 6deg;
  }
  100% {
    translate: 0 0;
    rotate: 3deg;
  }
}
@keyframes ghost-jump {
  0%, 100% {
    translate: 0 0;
    rotate: 0deg;
  }
  15% {
    translate: 0 -26px;
    rotate: -8deg;
  }
  30% {
    translate: 6px -10px;
    rotate: 7deg;
  }
  45% {
    translate: -6px -16px;
    rotate: -5deg;
  }
  60% {
    translate: 4px -4px;
    rotate: 3deg;
  }
}
@keyframes ghost-boo {
  0% {
    opacity: 0;
    scale: 0.3;
    rotate: -14deg;
    translate: -50% 0;
  }
  35% {
    opacity: 1;
    scale: 1.25;
    rotate: 6deg;
    translate: -50% -40%;
  }
  70% {
    opacity: 1;
    scale: 1;
    rotate: -3deg;
    translate: -50% -70%;
  }
  100% {
    opacity: 0;
    scale: 0.9;
    rotate: 0deg;
    translate: -50% -110%;
  }
}
@keyframes ghost-bob {
  0%, 100% {
    translate: 0 0;
    scale: 1 1;
  }
  25% {
    translate: 0 -14px;
    scale: 0.95 1.06;
  }
  50% {
    translate: 0 -4px;
    scale: 1.04 0.96;
  }
  75% {
    translate: 0 8px;
    scale: 0.98 1.03;
  }
}
@keyframes ghost-puff {
  0% {
    translate: 0 0;
    scale: 0.4;
    opacity: 0.95;
  }
  60% {
    opacity: 0.8;
  }
  100% {
    translate: var(--dx) var(--dy);
    scale: 1.6;
    opacity: 0;
  }
}
@keyframes ghost-flash {
  0% {
    scale: 0.2;
    opacity: 0.9;
  }
  100% {
    scale: 2.4;
    opacity: 0;
  }
}
@layer components {
  .drift-ghost {
    display: none;
  }
  @media (min-width: 768px) and (hover: hover) {
    .drift-field {
      position: relative;
      display: block;
      height: clamp(900px, 125vh, 1240px);
    }
    .contain-paint:has(> .drift-field) {
      contain: none !important;
      max-width: none !important;
    }
    .drift-field > li {
      position: absolute;
      width: clamp(280px, 26vw, 360px);
      z-index: 1;
    }
    .drift-field > li:nth-child(8n + 1) {
      left: 0%;
      top: 2%;
    }
    .drift-field > li:nth-child(8n + 2) {
      left: 22%;
      top: 44%;
    }
    .drift-field > li:nth-child(8n + 3) {
      left: 46%;
      top: 0%;
    }
    .drift-field > li:nth-child(8n + 4) {
      left: 70%;
      top: 40%;
    }
    .drift-field > li:nth-child(8n + 5) {
      left: 4%;
      top: 58%;
    }
    .drift-field > li:nth-child(8n + 6) {
      left: 28%;
      top: 10%;
    }
    .drift-field > li:nth-child(8n + 7) {
      left: 72%;
      top: 0%;
    }
    .drift-field > li:nth-child(8n + 8) {
      left: 50%;
      top: 56%;
    }
    .drift-card {
      position: relative;
    }
    .drift-ghost__wrap {
      display: block;
    }
    .drift-ghost--2 {
      width: 64%;
      left: 18%;
    }
    .drift-ghost--3 {
      width: 70%;
      left: 15%;
    }
    .drift-ghost--4 {
      width: 84%;
      left: 8%;
    }
    .drift-ghost--5 {
      width: 72%;
      left: 14%;
    }
    .drift-ghost--6 {
      width: 90%;
      left: 5%;
    }
    .drift-ghost--7 {
      width: 66%;
      left: 17%;
    }
    .drift-ghost--8 {
      width: 80%;
      left: 10%;
    }
    .drift-ghost--6 .drift-ghost__body {
      filter: drop-shadow(0 0 16px color-mix(in srgb, #171717 60%, transparent)) drop-shadow(0 10px 18px rgba(0, 0, 0, 0.5));
      @supports (color: color-mix(in lab, red, red)) {
        filter: drop-shadow(0 0 16px color-mix(in srgb, var(--color-interactive) 60%, transparent)) drop-shadow(0 10px 18px rgba(0, 0, 0, 0.5));
      }
    }
    .drift-ghost__boo {
      position: absolute;
      left: 50%;
      top: 10%;
      z-index: 4;
      opacity: 0;
      translate: -50% 0;
      font-family: var(--font-heading);
      font-size: clamp(2rem, 3.4vw, 3rem);
      font-weight: 800;
      line-height: 1;
      letter-spacing: 0.02em;
      white-space: nowrap;
      color: #fff;
      -webkit-text-stroke: 2px #2a1f33;
      text-shadow: 0 0 0.3em var(--color-interactive), 0 4px 0 #2a1f33;
      pointer-events: none;
    }
    .drift-ghost {
      display: block;
      position: absolute;
      left: 12%;
      top: 0;
      width: 76%;
      z-index: 3;
      pointer-events: none;
      transition: scale 450ms var(--ease-ui), opacity 350ms var(--ease-ui), filter 350ms var(--ease-ui);
    }
    .drift-ghost__body {
      display: block;
      width: 100%;
      height: auto;
      filter: drop-shadow(0 0 14px color-mix(in srgb, #fff 55%, transparent)) drop-shadow(0 10px 18px rgba(0, 0, 0, 0.45));
    }
    .drift-ghost__puff, .drift-ghost__flash {
      position: absolute;
      left: 50%;
      top: 45%;
      border-radius: 999px;
      opacity: 0;
      pointer-events: none;
    }
    .drift-ghost__puff {
      width: 34%;
      aspect-ratio: 1;
      margin: -17% 0 0 -17%;
      background: radial-gradient(circle at 40% 40%, #fff 0%, #ece4f3 45%, color-mix(in srgb, #ece4f3 0%, transparent) 72%);
    }
    .drift-ghost__flash {
      width: 60%;
      aspect-ratio: 1;
      margin: -30% 0 0 -30%;
      background: radial-gradient(circle, #fff 0%, color-mix(in srgb, #171717 60%, transparent) 40%, transparent 70%);
      @supports (color: color-mix(in lab, red, red)) {
        background: radial-gradient(circle, #fff 0%, color-mix(in srgb, var(--color-interactive) 60%, transparent) 40%, transparent 70%);
      }
    }
    .drift-ghost__puff:nth-child(2) {
      --dx: -120%;
      --dy: -110%;
    }
    .drift-ghost__puff:nth-child(3) {
      --dx: 130%;
      --dy: -90%;
    }
    .drift-ghost__puff:nth-child(4) {
      --dx: -150%;
      --dy: 40%;
    }
    .drift-ghost__puff:nth-child(5) {
      --dx: 150%;
      --dy: 60%;
    }
    .drift-ghost__puff:nth-child(6) {
      --dx: -30%;
      --dy: 150%;
    }
    .drift-ghost__puff:nth-child(7) {
      --dx: 40%;
      --dy: -160%;
    }
    .drift-card > :not(.drift-ghost) {
      opacity: 0;
      scale: 0.5;
      filter: blur(6px);
      transition: opacity 200ms var(--ease-ui), scale 250ms var(--ease-ui), filter 200ms var(--ease-ui);
    }
    .drift-field > li:hover, .drift-field > li:focus-within {
      z-index: 30;
    }
    .drift-field > li:hover .drift-card, .drift-field > li:focus-within .drift-card {
      animation-play-state: paused;
    }
    .drift-field > li:hover .drift-ghost__body, .drift-field > li:focus-within .drift-ghost__body {
      scale: 1.7;
      opacity: 0;
      filter: blur(8px);
      transition: scale 300ms var(--ease-ui), opacity 220ms var(--ease-ui), filter 260ms var(--ease-ui);
    }
    .drift-ghost__body {
      transition: scale 500ms var(--ease-ui), opacity 400ms var(--ease-ui) 80ms, filter 400ms var(--ease-ui);
    }
    .drift-field > li:hover .drift-card > :not(.drift-ghost), .drift-field > li:focus-within .drift-card > :not(.drift-ghost) {
      opacity: 1;
      scale: 1.06;
      filter: none;
      transition: opacity 300ms var(--ease-ui) 120ms, scale 450ms var(--ease-ui) 120ms, filter 300ms var(--ease-ui) 120ms;
    }
    @media (prefers-reduced-motion: no-preference) {
      .drift-field > li:nth-child(8n + 1) .drift-card {
        animation: drift-a 21s ease-in-out infinite;
      }
      .drift-field > li:nth-child(8n + 2) .drift-card {
        animation: drift-b 27s ease-in-out -6s infinite;
      }
      .drift-field > li:nth-child(8n + 3) .drift-card {
        animation: drift-c 18s ease-in-out -3s infinite reverse;
      }
      .drift-field > li:nth-child(8n + 4) .drift-card {
        animation: drift-d 30s ease-in-out -11s infinite;
      }
      .drift-field > li:nth-child(8n + 5) .drift-card {
        animation: drift-c 25s ease-in-out -14s infinite;
      }
      .drift-field > li:nth-child(8n + 6) .drift-card {
        animation: drift-d 23s ease-in-out -4s infinite reverse;
      }
      .drift-field > li:nth-child(8n + 7) .drift-card {
        animation: drift-b 19s ease-in-out -9s infinite reverse;
      }
      .drift-field > li:nth-child(8n + 8) .drift-card {
        animation: drift-a 33s ease-in-out -17s infinite reverse;
      }
      .drift-ghost__wrap {
        animation: ghost-bob 2.4s ease-in-out infinite;
        transform-origin: 50% 90%;
      }
      .drift-ghost--2 .drift-ghost__wrap {
        animation-duration: 4.2s;
      }
      .drift-ghost--3 .drift-ghost__wrap {
        animation-duration: 1.5s;
      }
      .drift-ghost--4 .drift-ghost__wrap {
        animation-duration: 3.1s;
        animation-delay: -1s;
      }
      .drift-ghost--5 .drift-ghost__wrap {
        animation-duration: 1.8s;
        animation-delay: -0.6s;
      }
      .drift-ghost--6 .drift-ghost__wrap {
        animation-duration: 1.1s;
      }
      .drift-ghost--7 .drift-ghost__wrap {
        animation-duration: 2s;
        animation-delay: -0.4s;
      }
      .drift-ghost--8 .drift-ghost__wrap {
        animation-duration: 5s;
        animation-delay: -2s;
      }
      .drift-field > li:hover .drift-ghost__boo, .drift-field > li:focus-within .drift-ghost__boo {
        animation: ghost-boo 900ms var(--ease-ui) forwards;
      }
      .drift-field:has(> li:hover) > li:not(:hover) .drift-ghost, .drift-field:has(> li:focus-within) > li:not(:focus-within) .drift-ghost {
        animation: ghost-jump 650ms var(--ease-ui);
      }
      .drift-field > li:hover .drift-ghost__puff, .drift-field > li:focus-within .drift-ghost__puff {
        animation: ghost-puff 650ms var(--ease-ui) forwards;
      }
      .drift-field > li:hover .drift-ghost__flash, .drift-field > li:focus-within .drift-ghost__flash {
        animation: ghost-flash 380ms var(--ease-ui) forwards;
      }
    }
  }
}
@keyframes neon-swing {
  0%, 100% {
    rotate: -1.6deg;
  }
  50% {
    rotate: 1.6deg;
  }
}
@keyframes neon-flicker {
  0%, 18%, 22%, 25%, 53%, 57%, 100% {
    opacity: 1;
    text-shadow: 0 0 0.04em #fff, 0 0 0.12em currentColor, 0 0 0.35em currentColor, 0 0 0.8em currentColor;
  }
  20%, 24%, 55% {
    opacity: 0.55;
    text-shadow: none;
  }
}
@keyframes neon-letter-fritz {
  0%, 8%, 12%, 40%, 44%, 46%, 100% {
    opacity: 1;
  }
  10%, 42%, 45% {
    opacity: 0.12;
  }
}
@layer components {
  .neon-sign {
    position: relative;
    display: inline-block;
    margin-top: 1.5rem;
    padding: 0.28em 0.6em 0.34em;
    border: 3px solid currentColor;
    border-radius: 0.4em;
    background: color-mix(in srgb, #000 45%, transparent);
    text-shadow: 0 0 0.04em #fff, 0 0 0.12em currentColor, 0 0 0.35em currentColor, 0 0 0.8em currentColor;
    box-shadow: 0 0 0.5rem currentColor, 0 0 1.6rem currentColor, inset 0 0 0.6rem currentColor;
    @supports (color: color-mix(in lab, red, red)) {
      box-shadow: 0 0 0.5rem currentColor, 0 0 1.6rem color-mix(in srgb, currentColor 45%, transparent), inset 0 0 0.6rem color-mix(in srgb, currentColor 50%, transparent);
    }
    transform-origin: 50% -260px;
    white-space: nowrap;
  }
  .neon-sign::before, .neon-sign::after {
    content: "";
    position: absolute;
    bottom: 100%;
    width: 2px;
    height: 400px;
    margin-bottom: 3px;
    background: linear-gradient(to top, #6b6475, #2a2530);
    box-shadow: none;
    pointer-events: none;
  }
  .neon-sign::before {
    left: 16%;
  }
  .neon-sign::after {
    right: 16%;
  }
  @media (prefers-reduced-motion: no-preference) {
    .neon-sign {
      animation: neon-swing 6s ease-in-out infinite, neon-flicker 7s linear infinite;
    }
    .neon-sign .haunt-word:last-child .haunt-ch:first-child {
      animation: neon-letter-fritz 4.3s linear infinite;
    }
  }
}
@keyframes neon-button-hum {
  0%, 100% {
    box-shadow: 0 0 0.4rem var(--color-interactive), 0 0 1.2rem color-mix(in srgb, var(--color-interactive) 55%, transparent), inset 0 0 0.4rem color-mix(in srgb, #fff 35%, transparent);
  }
  50% {
    box-shadow: 0 0 0.6rem var(--color-interactive), 0 0 2rem color-mix(in srgb, var(--color-interactive) 70%, transparent), inset 0 0 0.5rem color-mix(in srgb, #fff 45%, transparent);
  }
  92% {
    box-shadow: 0 0 0.15rem var(--color-interactive), inset 0 0 0.2rem color-mix(in srgb, #fff 20%, transparent);
  }
}
@layer components {
  .neon-button {
    border: 2px solid color-mix(in srgb, #fff 55%, #171717);
    @supports (color: color-mix(in lab, red, red)) {
      border: 2px solid color-mix(in srgb, #fff 55%, var(--color-interactive));
    }
    text-shadow: 0 0 0.35em color-mix(in srgb, #fff 70%, transparent);
    box-shadow: 0 0 0.4rem var(--color-interactive), 0 0 1.2rem color-mix(in srgb, #171717 55%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      box-shadow: 0 0 0.4rem var(--color-interactive), 0 0 1.2rem color-mix(in srgb, var(--color-interactive) 55%, transparent);
    }
  }
  @media (prefers-reduced-motion: no-preference) {
    .neon-button {
      animation: neon-button-hum 3.2s ease-in-out infinite;
      transition: scale 120ms var(--ease-ui), translate 250ms var(--ease-ui), filter 250ms var(--ease-ui);
    }
    .neon-button:active {
      scale: 0.97;
    }
    @media (hover: hover) {
      .neon-button:hover {
        translate: 0 -2px;
        filter: brightness(1.15) saturate(1.2);
        animation-duration: 1.1s;
      }
    }
  }
}
@keyframes sweep-in-left {
  from {
    translate: -100vw 0;
    rotate: -2deg;
    opacity: 0.4;
  }
  to {
    translate: 0 0;
    rotate: 0deg;
    opacity: 1;
  }
}
@keyframes sweep-in-right {
  from {
    translate: 100vw 0;
    rotate: 2deg;
    opacity: 0.4;
  }
  to {
    translate: 0 0;
    rotate: 0deg;
    opacity: 1;
  }
}
@layer components {
  @media (prefers-reduced-motion: no-preference) {
    @supports (animation-timeline: view()) {
      .motion-sweep-left {
        animation: sweep-in-left linear both;
        animation-timeline: view();
        animation-range: entry 0% cover 40%;
        transform-origin: 0% 50%;
      }
      .motion-sweep-right {
        animation: sweep-in-right linear both;
        animation-timeline: view();
        animation-range: entry 0% cover 40%;
        transform-origin: 100% 50%;
      }
    }
  }
}
@keyframes tv-noise {
  0% {
    background-position: 0 0;
  }
  20% {
    background-position: -40px 25px;
  }
  40% {
    background-position: 30px -50px;
  }
  60% {
    background-position: -70px -15px;
  }
  80% {
    background-position: 55px 40px;
  }
  100% {
    background-position: 0 0;
  }
}
@keyframes tv-static-burst {
  0%, 58%, 64%, 86%, 89%, 100% {
    opacity: 0.22;
  }
  60%, 62% {
    opacity: 0.95;
  }
  87.5% {
    opacity: 0.7;
  }
}
@keyframes tv-roll {
  from {
    translate: 0 -30%;
  }
  to {
    translate: 0 360%;
  }
}
@keyframes tv-broadcast {
  0%, 100% {
    scale: 1.06;
    translate: 0 0;
    filter: brightness(1) contrast(1.15) saturate(1.2);
  }
  30% {
    scale: 1.1;
    translate: -2% 1%;
  }
  31% {
    translate: 1.5% 1%;
    filter: brightness(1.35) contrast(1.3) saturate(1.5) hue-rotate(-12deg);
  }
  32% {
    translate: -2% 1%;
    filter: brightness(1) contrast(1.15) saturate(1.2);
  }
  60% {
    scale: 1.08;
    translate: 2% -1%;
  }
  61% {
    translate: 2% -4%;
    filter: brightness(0.6) contrast(1.4);
  }
  62% {
    translate: 2% -1%;
    filter: brightness(1) contrast(1.15) saturate(1.2);
  }
}
@keyframes tv-glow {
  0%, 100% {
    opacity: 0.55;
  }
  50% {
    opacity: 0.8;
  }
  61% {
    opacity: 0.25;
  }
}
@layer components {
  .tv-room {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.25rem;
    padding: 2.25rem 1.25rem 1.5rem;
    border-radius: 1.5rem;
    min-height: 34rem;
    background-color: #2b1f38;
  }
  .tv-room__wall {
    position: absolute;
    inset: 0 0 26% 0;
    z-index: -3;
  }
  .tv-room--1 .tv-room__wall {
    background: repeating-linear-gradient(90deg, #3d2650 0 18px, #4a2d61 18px 36px), #3d2650;
  }
  .tv-room--2 .tv-room__wall {
    background: radial-gradient(circle at 12px 12px, #2f5a5b 0 4px, transparent 5px) 0 0 / 28px 28px, radial-gradient(circle at 26px 26px, #2f5a5b 0 4px, transparent 5px) 0 0 / 28px 28px, #1f3a3d;
  }
  .tv-room--3 .tv-room__wall {
    background: conic-gradient(from 45deg, #26402a 0 25%, #1c3020 0 50%, #26402a 0 75%, #1c3020 0) 0 0 / 34px 34px, #1c3020;
  }
  .tv-room::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background: radial-gradient(ellipse 70% 55% at 50% 38%, transparent 0%, rgba(8, 4, 12, 0.55) 70%, rgba(8, 4, 12, 0.85) 100%);
  }
  .tv-room__floor {
    position: absolute;
    inset: 74% 0 0 0;
    z-index: -3;
    background: linear-gradient(to bottom, #1a1016 0 6px, transparent 6px), repeating-linear-gradient(90deg, #4a2f22 0 58px, #3e271c 58px 60px, #553627 60px 118px, #3e271c 118px 120px);
  }
  .tv-room--2 .tv-room__floor {
    background: linear-gradient(to bottom, #0f1718 0 6px, transparent 6px), repeating-linear-gradient(90deg, #3b2a2e 0 58px, #2d1f22 58px 60px, #463238 60px 118px, #2d1f22 118px 120px);
  }
  .tv-room__decor {
    position: absolute;
    z-index: -2;
    pointer-events: none;
  }
  .tv-room--1 .tv-room__decor {
    left: 6%;
    bottom: 22%;
    width: 18%;
    height: 46%;
    background: linear-gradient(#e7b35a, #e7b35a) 50% 100% / 8% 62% no-repeat, linear-gradient(#e7b35a, #e7b35a) 50% 100% / 60% 4% no-repeat;
  }
  .tv-room--1 .tv-room__decor::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 34%;
    clip-path: polygon(22% 0, 78% 0, 100% 100%, 0 100%);
    background: linear-gradient(#ff9ccf, #d86aa5);
    box-shadow: 0 0 40px #ff9ccf;
  }
  .tv-room--1 .tv-room__decor::after {
    content: "";
    position: absolute;
    left: -60%;
    right: -60%;
    top: 20%;
    height: 80%;
    background: radial-gradient(ellipse at 50% 0%, rgba(255, 156, 207, 0.35), transparent 65%);
  }
  .tv-room--2 .tv-room__decor {
    right: 5%;
    bottom: 22%;
    width: 22%;
    height: 40%;
    background: linear-gradient(#8a4b3a, #6a3527) 50% 100% / 56% 26% no-repeat;
  }
  .tv-room--2 .tv-room__decor::before {
    content: "";
    position: absolute;
    left: 6%;
    right: 6%;
    top: 0;
    height: 78%;
    background: radial-gradient(ellipse 30% 45% at 25% 60%, #3f7d4c 98%, transparent) , radial-gradient(ellipse 30% 50% at 75% 55%, #4f9a5c 98%, transparent), radial-gradient(ellipse 26% 52% at 50% 35%, #5fb06a 98%, transparent);
  }
  .tv-room--3 .tv-room__decor {
    right: 8%;
    top: 7%;
    width: 26%;
    aspect-ratio: 3 / 4;
    border: 5px solid #3a2a20;
    background: linear-gradient(#3a2a20, #3a2a20) 50% 0 / 5px 100% no-repeat, linear-gradient(#3a2a20, #3a2a20) 0 50% / 100% 5px no-repeat, radial-gradient(circle at 68% 30%, #f6f1d0 0 14%, rgba(246, 241, 208, 0.25) 15%, transparent 30%), linear-gradient(#141b3a, #2a1f4a);
    box-shadow: 0 0 30px rgba(246, 241, 208, 0.15);
  }
  .tv-set {
    position: relative;
    width: min(88%, 22rem);
    margin-top: 2.5rem;
  }
  .tv-set__antenna {
    position: absolute;
    left: 50%;
    bottom: 100%;
    width: 30%;
    height: 2.75rem;
    translate: -50% 0;
    pointer-events: none;
  }
  .tv-set__antenna::before, .tv-set__antenna::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 3px;
    height: 125%;
    background: linear-gradient(#cfc6d6, #7d7385);
    transform-origin: 50% 100%;
    border-radius: 2px;
  }
  .tv-set__antenna::before {
    rotate: -32deg;
  }
  .tv-set__antenna::after {
    rotate: 24deg;
    height: 105%;
  }
  .tv-room--2 .tv-set__antenna::after {
    rotate: 58deg;
    height: 80%;
  }
  .tv-room--3 .tv-set__antenna::before {
    rotate: -60deg;
  }
  .tv-set__body {
    position: relative;
    padding: 0.8rem 0.8rem 0;
    border-radius: 1.1rem;
    background: linear-gradient(160deg, #7a5138, #4d3122 70%);
    box-shadow: inset 0 2px 0 rgba(255, 255, 255, 0.15), inset 0 -4px 0 rgba(0, 0, 0, 0.35), 0 18px 30px rgba(0, 0, 0, 0.55);
  }
  .tv-room--2 .tv-set__body {
    background: linear-gradient(160deg, #c9b9a6, #8d7c69 70%);
  }
  .tv-room--3 .tv-set__body {
    background: linear-gradient(160deg, #3b3a45, #1f1e27 70%);
  }
  .tv-set__bezel {
    padding: 0.55rem;
    border-radius: 1rem;
    background: #141018;
    box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.06);
  }
  .tv-set__screen {
    position: relative;
    overflow: hidden;
    aspect-ratio: 4 / 3;
    border-radius: 14% / 18%;
    background: #0d0b10;
    box-shadow: inset 0 0 30px rgba(0, 0, 0, 0.9);
  }
  .tv-set__screen img {
    object-fit: cover;
  }
  .tv-set__fx, .tv-set__fx > * {
    position: absolute;
    inset: 0;
    pointer-events: none;
  }
  .tv-set__fx {
    z-index: 2;
    border-radius: inherit;
  }
  .tv-set__static {
    opacity: 0.22;
    mix-blend-mode: screen;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.95' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
    background-size: 180px 180px;
  }
  .tv-set__scan {
    background: repeating-linear-gradient(to bottom, rgba(0, 0, 0, 0.35) 0 1px, transparent 1px 3px);
  }
  .tv-set__roll {
    inset: auto 0 auto 0 !important;
    top: 0 !important;
    height: 22%;
    background: linear-gradient(to bottom, transparent, rgba(255, 255, 255, 0.12), transparent);
    translate: 0 -30%;
  }
  .tv-set__glass {
    background: radial-gradient(ellipse 80% 60% at 30% 20%, rgba(255, 255, 255, 0.16), transparent 60%), radial-gradient(ellipse at 50% 50%, transparent 55%, rgba(0, 0, 0, 0.6) 100%);
  }
  .tv-set__crack {
    width: 100%;
    height: 100%;
  }
  .tv-set__panel {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.55rem 0.4rem 0.6rem;
  }
  .tv-set__grille {
    flex: 1;
    height: 0.9rem;
    border-radius: 4px;
    background: repeating-linear-gradient(90deg, rgba(0, 0, 0, 0.45) 0 2px, transparent 2px 5px);
  }
  .tv-set__knobs {
    display: flex;
    gap: 0.45rem;
  }
  .tv-set__knobs span {
    width: 1.05rem;
    aspect-ratio: 1;
    border-radius: 999px;
    background: radial-gradient(circle at 35% 35%, #e8dfd2, #8b7f72);
    box-shadow: 0 2px 0 rgba(0, 0, 0, 0.45);
  }
  .tv-set__knobs span:last-child {
    background: radial-gradient(circle at 35% 35%, #ff9ccf, #b04a82);
  }
  .tv-set__legs {
    display: flex;
    justify-content: space-between;
    padding: 0 18%;
  }
  .tv-set__legs::before, .tv-set__legs::after {
    content: "";
    width: 7px;
    height: 1.6rem;
    border-radius: 0 0 3px 3px;
    background: linear-gradient(#3a2418, #22140d);
  }
  .tv-set__legs::before {
    rotate: 12deg;
    transform-origin: top;
  }
  .tv-set__legs::after {
    rotate: -12deg;
    transform-origin: top;
  }
  .tv-set::before {
    content: "";
    position: absolute;
    inset: -18% -22% 10%;
    z-index: -1;
    pointer-events: none;
    border-radius: 50%;
    background: radial-gradient(ellipse, color-mix(in srgb, #9fd4ff 45%, transparent), transparent 70%);
    opacity: 0.55;
  }
  .tv-room__caption {
    position: relative;
    z-index: 1;
    width: 100%;
    margin-top: auto;
    padding: 1rem 1.1rem 1.1rem;
    border-radius: 1rem;
    background: color-mix(in srgb, #0d0910 72%, transparent);
    backdrop-filter: blur(4px);
  }
  @media (prefers-reduced-motion: no-preference) {
    .tv-set__static {
      animation: tv-noise 0.35s steps(1) infinite, tv-static-burst 7s linear infinite;
    }
    .tv-room--2 .tv-set__static {
      animation-delay: 0s, -2.3s;
    }
    .tv-room--3 .tv-set__static {
      animation-delay: 0s, -4.6s;
    }
    .tv-set__roll {
      animation: tv-roll 4.5s linear infinite;
    }
    .tv-room--2 .tv-set__roll {
      animation-duration: 6s;
    }
    .tv-room--3 .tv-set__roll {
      animation-duration: 3.4s;
    }
    .tv-set__screen img {
      animation: tv-broadcast 9s ease-in-out infinite;
    }
    .tv-room--2 .tv-set__screen img {
      animation-duration: 11s;
      animation-delay: -3s;
    }
    .tv-room--3 .tv-set__screen img {
      animation-duration: 8s;
      animation-delay: -5s;
    }
    .tv-set::before {
      animation: tv-glow 9s ease-in-out infinite;
    }
    .tv-set__static {
      transition: opacity 300ms var(--ease-ui);
    }
    @media (hover: hover) {
      .tv-room:hover .tv-set__static {
        animation: tv-noise 0.35s steps(1) infinite;
        opacity: 0.08;
      }
      .tv-room:hover .tv-set__screen img {
        animation-duration: 18s;
      }
    }
  }
}
@keyframes tv-nosignal-burst {
  0%, 59%, 63%, 86.5%, 88.5%, 100% {
    opacity: 0;
  }
  60%, 62% {
    opacity: 1;
  }
  87.5% {
    opacity: 0.8;
  }
}
@keyframes tv-nosignal-blink {
  0%, 100% {
    opacity: 1;
  }
  50% {
    opacity: 0.35;
  }
}
@keyframes tv-dust-drift {
  from {
    background-position: 0 0, 0 0, 0 0;
  }
  to {
    background-position: 220px -340px, -180px -420px, 120px -260px;
  }
}
@keyframes tv-caption-in {
  from {
    opacity: 0;
    translate: -16px 0;
    filter: blur(4px);
  }
  to {
    opacity: 1;
    translate: 0 0;
    filter: blur(0);
  }
}
@layer components {
  .tv-set__nosignal {
    display: grid;
    place-items: center;
    opacity: 0;
    z-index: 3;
  }
  .tv-set__nosignal span {
    padding: 0.3em 0.7em;
    font-family: var(--font-heading);
    font-size: clamp(0.7rem, 1.3vw, 1rem);
    font-weight: 700;
    letter-spacing: 0.18em;
    color: #fff;
    background: rgba(10, 8, 20, 0.7);
    border: 1px solid rgba(255, 255, 255, 0.55);
    text-shadow: 2px 0 rgba(255, 60, 120, 0.8), -2px 0 rgba(60, 220, 255, 0.8);
  }
  .tv-room[data-switching] .tv-set__static {
    animation: tv-noise 0.2s steps(1) infinite !important;
    opacity: 1 !important;
  }
  .tv-room__channel {
    font-family: var(--font-heading);
    font-size: 0.75rem;
    letter-spacing: 0.22em;
    color: var(--color-interactive);
    text-shadow: 0 0 8px var(--color-interactive);
  }
  .tv-bedroom {
    display: grid;
    grid-template-columns: 1fr;
  }
  .tv-bedroom__stage, .tv-bedroom__camera, .tv-bedroom__tvs, .tv-bedroom__captions {
    display: contents;
  }
  .tv-bedroom__backdrop, .tv-bedroom__dust, .tv-bedroom__vignette, .tv-remote {
    display: none;
  }
  .tv-bedroom .tv-room {
    min-height: 22rem;
    border-radius: 1.5rem 1.5rem 0 0;
    padding-bottom: 2.5rem;
  }
  .tv-bedroom .tv-room--1 {
    order: 1;
  }
  .tv-bedroom .tv-room__caption--1 {
    order: 2;
  }
  .tv-bedroom .tv-room--2 {
    order: 3;
  }
  .tv-bedroom .tv-room__caption--2 {
    order: 4;
  }
  .tv-bedroom .tv-room--3 {
    order: 5;
  }
  .tv-bedroom .tv-room__caption--3 {
    order: 6;
  }
  .tv-bedroom .tv-room__caption {
    margin: 0 0 1rem;
    border-radius: 0 0 1.5rem 1.5rem;
    background: #120c18;
  }
  @media (min-width: 768px) {
    .tv-bedroom {
      --cam-x: 0%;
      --cam-y: 0%;
      --cam-z: 0px;
      position: relative;
      display: block;
      width: 100vw;
      margin-inline: calc(50% - 50vw);
    }
    .tv-bedroom[data-active="1"] {
      --cam-x: 0%;
      --cam-y: 14%;
      --cam-z: 90px;
    }
    .tv-bedroom[data-active="2"] {
      --cam-x: -14%;
      --cam-y: 7%;
      --cam-z: 130px;
    }
    .tv-bedroom[data-active="3"] {
      --cam-x: 14%;
      --cam-y: 7%;
      --cam-z: 120px;
    }
    .tv-bedroom__stage {
      --px: 0;
      --py: 0;
      position: relative;
      display: block;
      height: min(86svh, 56vw);
      min-height: 460px;
      overflow: hidden;
      container-type: size;
      perspective: 1100px;
      perspective-origin: 50% 45%;
      background: #050308;
    }
    .tv-bedroom__camera {
      position: absolute;
      left: 50%;
      top: 50%;
      display: block;
      width: max(100cqw, calc(100cqh * 1264 / 848));
      aspect-ratio: 1264 / 848;
      translate: -50% -50%;
      transform-style: preserve-3d;
      transform: translateZ(var(--cam-z)) rotateX(calc(var(--py) * 3deg)) rotateY(calc(var(--px) * -4deg)) translate3d(var(--cam-x), var(--cam-y), 0);
      transition: transform 1.1s var(--ease-ui);
    }
    .tv-bedroom__backdrop {
      position: absolute;
      inset: 0;
      display: block;
      scale: 1.18;
    }
    .tv-bedroom__backdrop img {
      width: 100%;
      height: 100%;
      object-fit: fill;
      filter: brightness(0.5) contrast(1.15) saturate(1.05);
    }
    .tv-bedroom__tvs {
      position: absolute;
      inset: 0;
      display: block;
      scale: 1.18;
      transform-style: preserve-3d;
    }
    .tv-bedroom .tv-room {
      position: absolute;
      display: block;
      min-height: 0;
      padding: 0;
      overflow: visible;
      border-radius: 0;
      background: none;
      cursor: pointer;
      transition: filter 400ms var(--ease-ui);
    }
    .tv-bedroom .tv-room::after, .tv-bedroom .tv-room__wall, .tv-bedroom .tv-room__floor, .tv-bedroom .tv-room__decor, .tv-bedroom .tv-set__antenna, .tv-bedroom .tv-set__panel, .tv-bedroom .tv-set__legs {
      display: none;
    }
    .tv-bedroom .tv-set, .tv-bedroom .tv-set__body, .tv-bedroom .tv-set__bezel {
      width: 100%;
      height: 100%;
      margin: 0;
      padding: 0;
      border-radius: 0;
      background: none;
      box-shadow: none;
    }
    .tv-bedroom .tv-set__screen {
      width: 100%;
      height: 100%;
      aspect-ratio: auto;
      border-radius: 0;
      clip-path: var(--screen-clip);
      box-shadow: inset 0 0 18px rgba(0, 0, 0, 0.85);
    }
    .tv-bedroom .tv-set__screen > :first-child, .tv-bedroom .tv-set__screen img {
      width: 100%;
      height: 100%;
    }
    .tv-bedroom .tv-set__nosignal span {
      font-size: clamp(0.45rem, 0.75vw, 0.85rem);
      letter-spacing: 0.12em;
    }
    .tv-bedroom .tv-set::before {
      inset: -70% -90%;
    }
    .tv-bedroom .tv-room--1 {
      left: 46.09%;
      top: 33.49%;
      width: 6.24%;
      height: 7.66%;
      --screen-clip: polygon(6.0% 4.1%, 92.7% 4.1%, 95.4% 94.4%, 6.0% 96.0%);
    }
    .tv-bedroom .tv-room--2 {
      left: 76.31%;
      top: 43.75%;
      width: 6.48%;
      height: 8.72%;
      --screen-clip: polygon(8.6% 2.0%, 96.7% 6.4%, 91.2% 99.4%, 5.7% 91.1%);
    }
    .tv-bedroom .tv-room--3 {
      left: 19.59%;
      top: 39.98%;
      width: 10.43%;
      height: 13.55%;
      --screen-clip: polygon(2.0% 5.0%, 94.8% 1.4%, 96.6% 88.0%, 5.2% 99.6%);
    }
    .tv-bedroom .tv-room:not([data-active]) {
      filter: brightness(0.72) saturate(0.7);
    }
    .tv-bedroom .tv-room:not([data-active]) .tv-set__screen img {
      filter: grayscale(1) brightness(0.5) blur(1px);
    }
    .tv-bedroom .tv-room:not([data-active]) .tv-set__static {
      opacity: 0.85;
    }
    .tv-bedroom .tv-room:not([data-active]) .tv-set__nosignal {
      opacity: 1;
    }
    .tv-bedroom .tv-room:not([data-active]) .tv-set::before {
      opacity: 0.2;
    }
    .tv-bedroom .tv-room:not([data-active]):hover {
      filter: brightness(1) saturate(1) drop-shadow(0 0 14px var(--color-interactive));
    }
    .tv-bedroom .tv-room[data-active] {
      cursor: default;
    }
    .tv-bedroom__dust {
      position: absolute;
      inset: -10%;
      display: block;
      pointer-events: none;
      transform: translateZ(140px);
      opacity: 0.45;
      mix-blend-mode: screen;
      background: radial-gradient(circle, rgba(255, 230, 255, 0.8) 0 1px, transparent 2px) 0 0 / 140px 170px, radial-gradient(circle, rgba(255, 200, 240, 0.6) 0 1.5px, transparent 2.5px) 40px 60px / 230px 210px, radial-gradient(circle, rgba(200, 240, 255, 0.5) 0 1px, transparent 2px) 90px 20px / 190px 260px;
    }
    .tv-bedroom__vignette {
      position: absolute;
      inset: 0;
      display: block;
      pointer-events: none;
      background: radial-gradient(ellipse 70% 65% at 50% 50%, transparent 35%, rgba(3, 1, 6, 0.9) 100%), linear-gradient(to bottom, rgba(3, 1, 6, 0.35), transparent 14%, transparent 86%, rgba(3, 1, 6, 0.5));
    }
    .tv-bedroom__stage::after {
      content: "";
      position: absolute;
      inset: 0;
      pointer-events: none;
      mix-blend-mode: screen;
      background: radial-gradient(ellipse 45% 40% at var(--glow-x, 50%) var(--glow-y, 40%), rgba(150, 200, 255, 0.16), transparent 70%);
      transition: background-position 1s var(--ease-ui);
    }
    .tv-bedroom[data-active="1"] .tv-bedroom__stage {
      --glow-x: 50%;
      --glow-y: 38%;
    }
    .tv-bedroom[data-active="2"] .tv-bedroom__stage {
      --glow-x: 66%;
      --glow-y: 46%;
    }
    .tv-bedroom[data-active="3"] .tv-bedroom__stage {
      --glow-x: 34%;
      --glow-y: 46%;
    }
    .tv-bedroom .tv-room[data-active] .tv-set__bezel {
      filter: drop-shadow(0 0 6px rgba(200, 230, 255, 0.95)) drop-shadow(0 0 22px rgba(150, 200, 255, 0.8)) drop-shadow(0 0 48px color-mix(in srgb, #171717 70%, transparent));
      @supports (color: color-mix(in lab, red, red)) {
        filter: drop-shadow(0 0 6px rgba(200, 230, 255, 0.95)) drop-shadow(0 0 22px rgba(150, 200, 255, 0.8)) drop-shadow(0 0 48px color-mix(in srgb, var(--color-interactive) 70%, transparent));
      }
    }
    .tv-bedroom .tv-room[data-active] .tv-set__screen img {
      filter: brightness(1.25) contrast(1.15) saturate(1.3);
    }
    .tv-bedroom .tv-room[data-active] .tv-set::before {
      inset: -160% -220%;
      opacity: 1;
      mix-blend-mode: screen;
      background: radial-gradient(ellipse, rgba(170, 215, 255, 0.55), color-mix(in srgb, #171717 22%, transparent) 40%, transparent 70%);
      @supports (color: color-mix(in lab, red, red)) {
        background: radial-gradient(ellipse, rgba(170, 215, 255, 0.55), color-mix(in srgb, var(--color-interactive) 22%, transparent) 40%, transparent 70%);
      }
    }
    .tv-bedroom .tv-room[data-switching] .tv-set__bezel {
      filter: brightness(2.2) drop-shadow(0 0 30px #fff);
    }
    .tv-bedroom__captions {
      position: absolute;
      top: 2rem;
      left: max(1.5rem, 4vw);
      z-index: 3;
      display: block;
      width: min(22rem, 34%);
    }
    .tv-bedroom .tv-room__caption {
      margin: 0;
      border-radius: 1rem;
      background: color-mix(in srgb, #0d0910 78%, transparent);
      border: 1px solid color-mix(in srgb, #171717 45%, transparent);
      @supports (color: color-mix(in lab, red, red)) {
        border: 1px solid color-mix(in srgb, var(--color-interactive) 45%, transparent);
      }
      box-shadow: 0 0 24px color-mix(in srgb, #171717 25%, transparent), 0 16px 40px rgba(0, 0, 0, 0.5);
      @supports (color: color-mix(in lab, red, red)) {
        box-shadow: 0 0 24px color-mix(in srgb, var(--color-interactive) 25%, transparent), 0 16px 40px rgba(0, 0, 0, 0.5);
      }
    }
    .tv-bedroom .tv-room__caption:not([data-active]) {
      display: none !important;
    }
    .tv-remote {
      position: absolute;
      right: 30%;
      bottom: 1.5rem;
      z-index: 4;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 0.6em;
      font-size: clamp(9px, 0.8vw, 12.5px);
    }
    .tv-remote__body {
      position: relative;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 0.9em;
      width: 8.5em;
      padding: 1.3em 1em 1.6em;
      border-radius: 2.6em 2.6em 3.2em 3.2em;
      background: linear-gradient(160deg, #3a3344 0%, #1c1824 55%, #110e16 100%);
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.18), inset 0 -6px 12px rgba(0, 0, 0, 0.5), -14px 26px 34px rgba(0, 0, 0, 0.65);
      transform: perspective(700px) rotateX(26deg) rotateZ(-12deg);
      transform-origin: 50% 100%;
    }
    .tv-remote__led {
      width: 0.6em;
      aspect-ratio: 1;
      border-radius: 999px;
      background: #5a1020;
      box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.4);
      transition: background 120ms, box-shadow 120ms;
    }
    .tv-remote[data-blink] .tv-remote__led {
      background: #ff3b5c;
      box-shadow: 0 0 10px #ff3b5c, 0 0 20px #ff3b5c;
    }
    .tv-remote__keys {
      display: grid;
      gap: 0.55em;
      width: 100%;
    }
    .tv-remote__key, .tv-remote__step {
      cursor: pointer;
      border: 0;
      color: #f3e9f7;
      background: linear-gradient(#4a4256, #2a2433);
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 3px 0 #0b090e, 0 5px 8px rgba(0, 0, 0, 0.5);
      transition: translate 100ms var(--ease-ui), box-shadow 100ms var(--ease-ui), background 200ms;
    }
    .tv-remote__key {
      display: flex;
      align-items: center;
      gap: 0.6em;
      width: 100%;
      padding: 0.5em 0.7em;
      border-radius: 0.9em;
      text-align: left;
    }
    .tv-remote__num {
      display: grid;
      place-items: center;
      width: 1.7em;
      aspect-ratio: 1;
      border-radius: 999px;
      font-family: var(--font-heading);
      font-size: 1.05em;
      font-weight: 700;
      background: rgba(0, 0, 0, 0.35);
    }
    .tv-remote__label {
      font-size: 0.95em;
      font-weight: 600;
    }
    .tv-remote__key[aria-pressed="true"] {
      background: linear-gradient(#ff8cc6, #c94d8d);
      color: #1a0b14;
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 3px 0 #6d1f47, 0 0 18px color-mix(in srgb, #171717 70%, transparent);
      @supports (color: color-mix(in lab, red, red)) {
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 3px 0 #6d1f47, 0 0 18px color-mix(in srgb, var(--color-interactive) 70%, transparent);
      }
    }
    .tv-remote__key:active, .tv-remote__step:active {
      translate: 0 2px;
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 0 #0b090e;
    }
    .tv-remote__key:focus-visible, .tv-remote__step:focus-visible {
      outline: 2px solid #fff;
      outline-offset: 2px;
    }
    .tv-remote__rocker {
      display: flex;
      align-items: center;
      justify-content: space-between;
      width: 100%;
      padding: 0.35em;
      border-radius: 999px;
      background: rgba(0, 0, 0, 0.35);
    }
    .tv-remote__step {
      display: grid;
      place-items: center;
      width: 2.3em;
      aspect-ratio: 1;
      border-radius: 999px;
      font-size: 0.8em;
    }
    .tv-remote__ch {
      font-family: var(--font-heading);
      font-size: 0.8em;
      letter-spacing: 0.15em;
      color: #b9adc4;
    }
    .tv-remote__grille {
      width: 60%;
      height: 1.4em;
      border-radius: 0.4em;
      background: radial-gradient(circle, rgba(0, 0, 0, 0.6) 0 1.5px, transparent 2px) 0 0 / 7px 7px;
    }
    .tv-bedroom[data-remote-follow] .tv-remote {
      left: 0;
      top: 0;
      right: auto;
      bottom: auto;
      translate: var(--remote-x, 0) var(--remote-y, 0);
      pointer-events: none;
      transition: translate 420ms var(--ease-ui);
    }
    .tv-bedroom[data-remote-follow] .tv-remote__body {
      transform: perspective(700px) rotateX(26deg) rotateZ(var(--remote-tilt, -12deg));
      transition: transform 420ms var(--ease-ui);
    }
    .tv-bedroom[data-remote-follow] .tv-remote:focus-within {
      pointer-events: auto;
    }
    .tv-bedroom[data-remote-follow] .tv-bedroom__stage {
      cursor: pointer;
    }
    .tv-remote__key[data-pressed], .tv-remote__step[data-pressed] {
      translate: 0 2px;
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 0 #0b090e;
    }
    .tv-remote__hint {
      transition: opacity 300ms var(--ease-ui);
      font-size: 0.85em;
      font-weight: 600;
      color: var(--color-interactive);
      text-shadow: 0 0 10px color-mix(in srgb, #171717 60%, transparent);
      @supports (color: color-mix(in lab, red, red)) {
        text-shadow: 0 0 10px color-mix(in srgb, var(--color-interactive) 60%, transparent);
      }
      rotate: -4deg;
    }
    @media (prefers-reduced-motion: no-preference) {
      .tv-bedroom .tv-room[data-active] .tv-set__nosignal {
        animation: tv-nosignal-burst 7s linear infinite;
      }
      .tv-bedroom .tv-room--2[data-active] .tv-set__nosignal {
        animation-delay: -2.3s;
      }
      .tv-bedroom .tv-room--3[data-active] .tv-set__nosignal {
        animation-delay: -4.6s;
      }
      .tv-bedroom .tv-room:not([data-active]) .tv-set__nosignal span {
        animation: tv-nosignal-blink 1.6s steps(2) infinite;
      }
      .tv-bedroom .tv-room:not([data-active]) .tv-set__static {
        animation: tv-noise 0.3s steps(1) infinite;
      }
      .tv-bedroom__dust {
        animation: tv-dust-drift 40s linear infinite;
      }
      .tv-bedroom .tv-room__caption[data-active] {
        animation: tv-caption-in 500ms var(--ease-ui) both;
      }
      .tv-bedroom:hover .tv-room[data-active]:hover .tv-set__nosignal {
        animation: none;
        opacity: 0;
      }
    }
    @media (prefers-reduced-motion: reduce) {
      .tv-bedroom__camera {
        transition: none;
      }
    }
  }
  @media (max-width: 767.98px) and (prefers-reduced-motion: no-preference) {
    .tv-set__nosignal {
      animation: tv-nosignal-burst 7s linear infinite;
    }
    .tv-room--2 .tv-set__nosignal {
      animation-delay: -2.3s;
    }
    .tv-room--3 .tv-set__nosignal {
      animation-delay: -4.6s;
    }
  }
}
@keyframes ghost-turn {
  0%, 100% {
    transform: rotateY(-28deg) rotateX(7deg) rotateZ(-3deg);
  }
  50% {
    transform: rotateY(28deg) rotateX(-5deg) rotateZ(3deg);
  }
}
@keyframes ghost-face-turn {
  0%, 100% {
    translate: -8px 1px;
    scale: 0.92 1;
  }
  25% {
    translate: 0 0;
    scale: 1 1;
  }
  50% {
    translate: 8px -1px;
    scale: 0.92 1;
  }
  75% {
    translate: 0 0;
    scale: 1 1;
  }
}
@keyframes ghost-hat-turn {
  0%, 100% {
    translate: -11px 2px;
  }
  50% {
    translate: 11px -1px;
  }
}
@keyframes ghost-spec-turn {
  0%, 100% {
    translate: 7px 0;
    opacity: 0.95;
  }
  50% {
    translate: -7px 0;
    opacity: 0.6;
  }
}
@keyframes ghost-shadow {
  0%, 100% {
    scale: 1 1;
    opacity: 0.6;
  }
  25% {
    scale: 0.72 0.7;
    opacity: 0.32;
  }
  50% {
    scale: 0.92 0.9;
    opacity: 0.5;
  }
  75% {
    scale: 1.1 1.08;
    opacity: 0.72;
  }
}
@layer components {
  .drift-ghost__shadow {
    display: none;
  }
  @media (min-width: 768px) and (hover: hover) {
    .drift-ghost {
      --turn: 5s;
      --bob: 2.4s;
      --bob-delay: 0s;
    }
    .drift-ghost--2 {
      --turn: 7s;
      --bob: 4.2s;
    }
    .drift-ghost--3 {
      --turn: 3.6s;
      --bob: 1.5s;
    }
    .drift-ghost--4 {
      --turn: 5.5s;
      --bob: 3.1s;
      --bob-delay: -1s;
    }
    .drift-ghost--5 {
      --turn: 4s;
      --bob: 1.8s;
      --bob-delay: -0.6s;
    }
    .drift-ghost--6 {
      --turn: 3s;
      --bob: 1.1s;
    }
    .drift-ghost--7 {
      --turn: 4.4s;
      --bob: 2s;
      --bob-delay: -0.4s;
    }
    .drift-ghost--8 {
      --turn: 8s;
      --bob: 5s;
      --bob-delay: -2s;
    }
    .drift-ghost__wrap {
      perspective: 520px;
    }
    .drift-ghost__body {
      transform-style: preserve-3d;
    }
    .drift-ghost__face, .drift-ghost__hat, .drift-ghost__spec {
      transform-box: fill-box;
      transform-origin: center;
    }
    .drift-ghost__shade {
      pointer-events: none;
    }
    .drift-ghost__shadow {
      position: absolute;
      left: 22%;
      right: 22%;
      top: 96%;
      display: block;
      height: 14%;
      border-radius: 50%;
      background: radial-gradient(ellipse, rgba(8, 4, 14, 0.75), rgba(8, 4, 14, 0) 70%);
      filter: blur(3px);
      pointer-events: none;
      transition: opacity 300ms var(--ease-ui);
    }
    .drift-field > li:hover .drift-ghost__shadow, .drift-field > li:focus-within .drift-ghost__shadow {
      opacity: 0 !important;
      animation-play-state: paused;
    }
    @media (prefers-reduced-motion: no-preference) {
      .drift-ghost__body {
        animation: ghost-turn var(--turn) ease-in-out infinite;
      }
      .drift-ghost__face {
        animation: ghost-face-turn var(--turn) ease-in-out infinite;
      }
      .drift-ghost__hat {
        animation: ghost-hat-turn var(--turn) ease-in-out infinite;
      }
      .drift-ghost__spec {
        animation: ghost-spec-turn var(--turn) ease-in-out infinite;
      }
      .drift-ghost__shadow {
        animation: ghost-shadow var(--bob) ease-in-out var(--bob-delay) infinite;
      }
    }
  }
}
@layer components {
  .tv-bedroom__sign {
    order: 0;
    margin-bottom: 2rem;
    text-align: center;
  }
  @media (min-width: 768px) {
    .tv-bedroom__sign {
      position: absolute;
      left: 48.7%;
      bottom: 73.5%;
      z-index: 2;
      margin: 0;
      translate: -50% 0;
      pointer-events: none;
    }
    .tv-bedroom__sign .neon-sign {
      margin-top: 0;
      font-size: clamp(1.6rem, 2.8vw, 3.25rem);
    }
  }
}
body:has(tv-bedroom[data-remote-follow]) .cursor-trail-layer {
  opacity: 0 !important;
}
@layer base {
  @media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
      animation-duration: 0.01ms !important;
      animation-delay: 0s !important;
      animation-iteration-count: 1 !important;
      transition-duration: 0.01ms !important;
      scroll-behavior: auto !important;
    }
  }
}
@layer components {
  .nav-has-dropdown {
    position: relative;
  }
  .nav-dropdown {
    position: absolute;
    top: 100%;
    inset-inline-start: -13px;
    padding-block-start: 10px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-4px);
    transition: opacity 0.15s var(--ease-ui), transform 0.15s var(--ease-ui), visibility 0.15s;
    z-index: 50;
    pointer-events: none;
  }
  @media (hover: hover) {
    .nav-has-dropdown:hover .nav-dropdown {
      opacity: 1;
      visibility: visible;
      transform: translateY(0);
      pointer-events: auto;
    }
    .nav-has-dropdown[data-suppress-hover]:hover .nav-dropdown {
      opacity: 0;
      visibility: hidden;
      transform: translateY(-4px);
      pointer-events: none;
    }
  }
  .nav-has-dropdown[data-open] .nav-dropdown {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    pointer-events: auto;
  }
  .nav-disclosure {
    position: absolute;
    inset-inline-start: 100%;
    inset-block-start: 50%;
    transform: translateY(-50%);
    margin-inline-start: 2px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 4px;
    border: 0;
    background: none;
    color: inherit;
    cursor: pointer;
    border-radius: var(--radius-sm);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.15s var(--ease-ui), transform 0.15s var(--ease-ui);
  }
  .nav-disclosure:active {
    transform: translateY(-50%) scale(0.90);
  }
  .nav-disclosure:focus-visible {
    opacity: 1;
    pointer-events: auto;
    outline: 2px solid var(--color-accent);
    outline-offset: 2px;
  }
  @media (hover: none) {
    .nav-disclosure {
      opacity: 1;
      pointer-events: auto;
    }
  }
  .nav-disclosure-icon {
    display: block;
    width: 0.75rem;
    height: 0.75rem;
    transition: transform 0.15s var(--ease-ui);
  }
  .nav-disclosure[aria-expanded='true'] .nav-disclosure-icon {
    transform: rotate(180deg);
  }
  .nav-dropdown-inner {
    background: var(--color-surface);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow);
    padding: 16px;
    display: grid;
    grid-template-columns: minmax(120px, max-content);
    grid-auto-flow: column;
    gap: 0 16px;
    min-width: 120px;
    max-width: calc(100vw - 2rem);
  }
  .nav-dropdown-inner:has(.nav-dropdown-group) {
    padding-inline-end: 14px;
  }
  @media (hover: hover) {
    .nav-dropdown-inner:hover > li > .nav-dropdown-item:not(:hover), .nav-dropdown-inner:hover > .nav-dropdown-group:not(:hover) > .nav-dropdown-row {
      opacity: 0.6;
    }
  }
  .nav-dropdown-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    font-size: 0.875rem;
    font-weight: 500;
    line-height: 1.35;
    color: var(--color-on-surface);
    text-decoration: none;
    padding: 3px 0;
    grid-column: 1;
    min-width: 120px;
    max-width: 16rem;
    white-space: normal;
    overflow-wrap: anywhere;
    transition: opacity 0.15s var(--ease-ui);
  }
  .nav-dropdown-row {
    grid-column: 1;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
  }
  .nav-dropdown-row > .nav-dropdown-item {
    min-width: 0;
    flex: 1 1 auto;
  }
  .nav-dropdown-disclosure {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 9px;
    border: 0;
    background: none;
    color: inherit;
    cursor: pointer;
    border-radius: var(--radius-sm);
    transition: transform 0.15s var(--ease-ui);
  }
  .nav-dropdown-disclosure:active {
    transform: scale(0.90);
  }
  .nav-dropdown-disclosure:focus-visible {
    outline: 2px solid var(--color-accent);
    outline-offset: 2px;
  }
  .nav-dropdown-disclosure svg {
    width: 6px;
    height: 9px;
  }
  @media (hover: none) {
    .nav-dropdown-disclosure {
      opacity: 1;
      pointer-events: auto;
    }
  }
  @media (hover: hover) {
    .nav-dropdown-group > .nav-dropdown-row::after {
      content: "";
      position: absolute;
      inset-block: 0;
      inset-inline-end: -24px;
      width: 24px;
    }
  }
  .nav-dropdown-group {
    display: contents;
  }
  .nav-dropdown-submenu {
    grid-column: 2;
    grid-row: 1 / span 10;
    display: none;
    padding: 16px;
    margin-block: -16px;
    border-inline-start: 1px solid var(--color-border);
    align-self: stretch;
    flex-direction: row;
    gap: 24px;
  }
  @media (hover: hover) {
    .nav-dropdown-group:hover > .nav-dropdown-submenu {
      display: flex;
      animation: navDropdownFadeIn 0.15s var(--ease-ui);
    }
    .nav-dropdown-group[data-suppress-hover]:hover > .nav-dropdown-submenu {
      display: none;
    }
  }
  .nav-dropdown-group[data-open] > .nav-dropdown-submenu {
    display: flex;
    animation: navDropdownFadeIn 0.15s var(--ease-ui);
  }
}
@keyframes navDropdownFadeIn {
  from {
    opacity: 0;
    transform: translateX(-2px) scale(0.99);
  }
  to {
    opacity: 1;
    transform: translateX(0) scale(1);
  }
}
@layer components {
  .nav-submenu-inner {
    display: grid;
    grid-template-columns: minmax(100px, max-content);
    grid-auto-flow: column;
    gap: 0 24px;
    min-width: 100px;
    align-content: start;
  }
  .nav-submenu-inner > li > .nav-dropdown-item {
    padding: 3px 0;
    grid-column: 1;
    min-width: 100px;
  }
  .nav-submenu-inner > .nav-dropdown-group > .nav-dropdown-row {
    grid-column: 1;
    min-width: 100px;
  }
  @media (hover: hover) {
    .nav-submenu-inner:hover > li > .nav-dropdown-item:not(:hover), .nav-submenu-inner:hover > .nav-dropdown-group:not(:hover) > .nav-dropdown-row {
      opacity: 0.6;
    }
  }
  .nav-submenu-inner > .nav-dropdown-group {
    display: contents;
  }
  .nav-submenu-inner > .nav-dropdown-group > .nav-dropdown-submenu {
    grid-column: 2;
    grid-row: 1 / span 10;
    display: none;
    padding-inline: 16px;
    border-inline-start: 1px solid var(--color-border);
    align-self: flex-start;
  }
  @media (hover: hover) {
    .nav-submenu-inner > .nav-dropdown-group:hover > .nav-dropdown-submenu {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      justify-content: flex-start;
      animation: navDropdownFadeIn 0.15s var(--ease-ui);
    }
    .nav-submenu-inner > .nav-dropdown-group[data-suppress-hover]:hover > .nav-dropdown-submenu {
      display: none;
    }
  }
  .nav-submenu-inner > .nav-dropdown-group[data-open] > .nav-dropdown-submenu {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    animation: navDropdownFadeIn 0.15s var(--ease-ui);
  }
  .nav-submenu-inner > .nav-dropdown-group > .nav-dropdown-submenu .nav-submenu-inner {
    min-width: 100px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
  }
  .nav-submenu-inner > .nav-dropdown-group > .nav-dropdown-submenu .nav-dropdown-item {
    padding: 3px 0;
  }
}
@property --tw-translate-x {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-translate-y {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-translate-z {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-scale-x {
  syntax: "*";
  inherits: false;
  initial-value: 1;
}
@property --tw-scale-y {
  syntax: "*";
  inherits: false;
  initial-value: 1;
}
@property --tw-scale-z {
  syntax: "*";
  inherits: false;
  initial-value: 1;
}
@property --tw-rotate-x {
  syntax: "*";
  inherits: false;
}
@property --tw-rotate-y {
  syntax: "*";
  inherits: false;
}
@property --tw-rotate-z {
  syntax: "*";
  inherits: false;
}
@property --tw-skew-x {
  syntax: "*";
  inherits: false;
}
@property --tw-skew-y {
  syntax: "*";
  inherits: false;
}
@property --tw-scroll-snap-strictness {
  syntax: "*";
  inherits: false;
  initial-value: proximity;
}
@property --tw-space-y-reverse {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-divide-y-reverse {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-border-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}
@property --tw-gradient-position {
  syntax: "*";
  inherits: false;
}
@property --tw-gradient-from {
  syntax: "<color>";
  inherits: false;
  initial-value: #0000;
}
@property --tw-gradient-via {
  syntax: "<color>";
  inherits: false;
  initial-value: #0000;
}
@property --tw-gradient-to {
  syntax: "<color>";
  inherits: false;
  initial-value: #0000;
}
@property --tw-gradient-stops {
  syntax: "*";
  inherits: false;
}
@property --tw-gradient-via-stops {
  syntax: "*";
  inherits: false;
}
@property --tw-gradient-from-position {
  syntax: "<length-percentage>";
  inherits: false;
  initial-value: 0%;
}
@property --tw-gradient-via-position {
  syntax: "<length-percentage>";
  inherits: false;
  initial-value: 50%;
}
@property --tw-gradient-to-position {
  syntax: "<length-percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --tw-leading {
  syntax: "*";
  inherits: false;
}
@property --tw-font-weight {
  syntax: "*";
  inherits: false;
}
@property --tw-tracking {
  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: 0px;
}
@property --tw-ring-offset-color {
  syntax: "*";
  inherits: false;
  initial-value: #fff;
}
@property --tw-ring-offset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-outline-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}
@property --tw-blur {
  syntax: "*";
  inherits: false;
}
@property --tw-brightness {
  syntax: "*";
  inherits: false;
}
@property --tw-contrast {
  syntax: "*";
  inherits: false;
}
@property --tw-grayscale {
  syntax: "*";
  inherits: false;
}
@property --tw-hue-rotate {
  syntax: "*";
  inherits: false;
}
@property --tw-invert {
  syntax: "*";
  inherits: false;
}
@property --tw-opacity {
  syntax: "*";
  inherits: false;
}
@property --tw-saturate {
  syntax: "*";
  inherits: false;
}
@property --tw-sepia {
  syntax: "*";
  inherits: false;
}
@property --tw-drop-shadow {
  syntax: "*";
  inherits: false;
}
@property --tw-drop-shadow-color {
  syntax: "*";
  inherits: false;
}
@property --tw-drop-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --tw-drop-shadow-size {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-blur {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-brightness {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-contrast {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-grayscale {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-hue-rotate {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-invert {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-opacity {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-saturate {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-sepia {
  syntax: "*";
  inherits: false;
}
@property --tw-duration {
  syntax: "*";
  inherits: false;
}
@property --tw-ease {
  syntax: "*";
  inherits: false;
}
@property --tw-contain-size {
  syntax: "*";
  inherits: false;
}
@property --tw-contain-layout {
  syntax: "*";
  inherits: false;
}
@property --tw-contain-paint {
  syntax: "*";
  inherits: false;
}
@property --tw-contain-style {
  syntax: "*";
  inherits: false;
}
@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-translate-x: 0;
      --tw-translate-y: 0;
      --tw-translate-z: 0;
      --tw-scale-x: 1;
      --tw-scale-y: 1;
      --tw-scale-z: 1;
      --tw-rotate-x: initial;
      --tw-rotate-y: initial;
      --tw-rotate-z: initial;
      --tw-skew-x: initial;
      --tw-skew-y: initial;
      --tw-scroll-snap-strictness: proximity;
      --tw-space-y-reverse: 0;
      --tw-divide-y-reverse: 0;
      --tw-border-style: solid;
      --tw-gradient-position: initial;
      --tw-gradient-from: #0000;
      --tw-gradient-via: #0000;
      --tw-gradient-to: #0000;
      --tw-gradient-stops: initial;
      --tw-gradient-via-stops: initial;
      --tw-gradient-from-position: 0%;
      --tw-gradient-via-position: 50%;
      --tw-gradient-to-position: 100%;
      --tw-leading: initial;
      --tw-font-weight: initial;
      --tw-tracking: initial;
      --tw-shadow: 0 0 #0000;
      --tw-shadow-color: initial;
      --tw-shadow-alpha: 100%;
      --tw-inset-shadow: 0 0 #0000;
      --tw-inset-shadow-color: initial;
      --tw-inset-shadow-alpha: 100%;
      --tw-ring-color: initial;
      --tw-ring-shadow: 0 0 #0000;
      --tw-inset-ring-color: initial;
      --tw-inset-ring-shadow: 0 0 #0000;
      --tw-ring-inset: initial;
      --tw-ring-offset-width: 0px;
      --tw-ring-offset-color: #fff;
      --tw-ring-offset-shadow: 0 0 #0000;
      --tw-outline-style: solid;
      --tw-blur: initial;
      --tw-brightness: initial;
      --tw-contrast: initial;
      --tw-grayscale: initial;
      --tw-hue-rotate: initial;
      --tw-invert: initial;
      --tw-opacity: initial;
      --tw-saturate: initial;
      --tw-sepia: initial;
      --tw-drop-shadow: initial;
      --tw-drop-shadow-color: initial;
      --tw-drop-shadow-alpha: 100%;
      --tw-drop-shadow-size: initial;
      --tw-backdrop-blur: initial;
      --tw-backdrop-brightness: initial;
      --tw-backdrop-contrast: initial;
      --tw-backdrop-grayscale: initial;
      --tw-backdrop-hue-rotate: initial;
      --tw-backdrop-invert: initial;
      --tw-backdrop-opacity: initial;
      --tw-backdrop-saturate: initial;
      --tw-backdrop-sepia: initial;
      --tw-duration: initial;
      --tw-ease: initial;
      --tw-contain-size: initial;
      --tw-contain-layout: initial;
      --tw-contain-paint: initial;
      --tw-contain-style: initial;
    }
  }
}