/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
@layer properties;
@layer theme, base, components, utilities;
@layer theme {
  :root, :host {
    --font-sans: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI Variable Text",
    "Segoe UI", Roboto, "PingFang SC", "Hiragino Sans GB", "Noto Sans SC",
    "Microsoft YaHei", sans-serif;
    --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
      "Courier New", monospace;
    --spacing: 0.25rem;
    --container-xl: 36rem;
    --container-2xl: 42rem;
    --container-3xl: 48rem;
    --container-4xl: 56rem;
    --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;
    --font-weight-medium: 500;
    --radius-sm: 10px;
    --ease-out: cubic-bezier(0, 0, 0.2, 1);
    --default-transition-duration: 150ms;
    --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    --default-font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI Variable Text",
    "Segoe UI", Roboto, "PingFang SC", "Hiragino Sans GB", "Noto Sans SC",
    "Microsoft YaHei", sans-serif;
    --default-mono-font-family: var(--font-mono);
    --radius: 14px;
    --font-display: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI Variable Display",
    "Segoe UI", Roboto, "PingFang SC", "Hiragino Sans GB", "Noto Sans SC",
    "Microsoft YaHei", sans-serif;
    --ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
  }
}
@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, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
    font-feature-settings: var(--default-font-feature-settings, normal);
    font-variation-settings: var(--default-font-variation-settings, normal);
    -webkit-tap-highlight-color: transparent;
  }
  hr {
    height: 0;
    color: inherit;
    border-top-width: 1px;
  }
  abbr:where([title]) {
    -webkit-text-decoration: underline dotted;
    text-decoration: underline dotted;
  }
  h1, h2, h3, h4, h5, h6 {
    font-size: inherit;
    font-weight: inherit;
  }
  a {
    color: inherit;
    -webkit-text-decoration: inherit;
    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:where(:not(iframe)) {
    outline: auto;
  }
  progress {
    vertical-align: baseline;
  }
  summary {
    display: list-item;
  }
  ol, ul, menu {
    list-style: none;
  }
  img, svg, video, canvas, audio, iframe, embed, object {
    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 {
  .pointer-events-none {
    pointer-events: none;
  }
  .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;
  }
  .absolute {
    position: absolute;
  }
  .fixed {
    position: fixed;
  }
  .relative {
    position: relative;
  }
  .static {
    position: static;
  }
  .sticky {
    position: sticky;
  }
  .inset-0 {
    inset: 0px;
  }
  .inset-x-0 {
    inset-inline: 0px;
  }
  .top-0 {
    top: 0px;
  }
  .bottom-0 {
    bottom: 0px;
  }
  .z-50 {
    z-index: 50;
  }
  .order-first {
    order: -9999;
  }
  .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;
    }
  }
  .mx-auto {
    margin-inline: auto;
  }
  .mt-0\.5 {
    margin-top: calc(var(--spacing) * 0.5);
  }
  .mt-1 {
    margin-top: var(--spacing);
  }
  .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-5 {
    margin-top: calc(var(--spacing) * 5);
  }
  .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-9 {
    margin-top: calc(var(--spacing) * 9);
  }
  .mt-10 {
    margin-top: calc(var(--spacing) * 10);
  }
  .mt-12 {
    margin-top: calc(var(--spacing) * 12);
  }
  .mt-14 {
    margin-top: calc(var(--spacing) * 14);
  }
  .mt-16 {
    margin-top: calc(var(--spacing) * 16);
  }
  .mt-auto {
    margin-top: auto;
  }
  .mb-6 {
    margin-bottom: calc(var(--spacing) * 6);
  }
  .mb-10 {
    margin-bottom: calc(var(--spacing) * 10);
  }
  .ml-auto {
    margin-left: auto;
  }
  .line-clamp-2 {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }
  .block {
    display: block;
  }
  .flex {
    display: flex;
  }
  .grid {
    display: grid;
  }
  .hidden {
    display: none;
  }
  .inline-block {
    display: inline-block;
  }
  .inline-flex {
    display: inline-flex;
  }
  .table {
    display: table;
  }
  .aspect-\[4\/3\] {
    aspect-ratio: 4/3;
  }
  .aspect-\[16\/9\] {
    aspect-ratio: 16/9;
  }
  .aspect-\[16\/10\] {
    aspect-ratio: 16/10;
  }
  .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-6 {
    width: calc(var(--spacing) * 6);
    height: calc(var(--spacing) * 6);
  }
  .size-9 {
    width: calc(var(--spacing) * 9);
    height: calc(var(--spacing) * 9);
  }
  .size-10 {
    width: calc(var(--spacing) * 10);
    height: calc(var(--spacing) * 10);
  }
  .size-\[1\.125rem\] {
    width: 1.125rem;
    height: 1.125rem;
  }
  .size-full {
    width: 100%;
    height: 100%;
  }
  .h-7 {
    height: calc(var(--spacing) * 7);
  }
  .h-14 {
    height: calc(var(--spacing) * 14);
  }
  .h-full {
    height: 100%;
  }
  .h-px {
    height: 1px;
  }
  .min-h-32 {
    min-height: calc(var(--spacing) * 32);
  }
  .min-h-\[70vh\] {
    min-height: 70vh;
  }
  .min-h-\[inherit\] {
    min-height: inherit;
  }
  .min-h-screen {
    min-height: 100vh;
  }
  .w-\[19rem\] {
    width: 19rem;
  }
  .w-auto {
    width: auto;
  }
  .w-full {
    width: 100%;
  }
  .w-px {
    width: 1px;
  }
  .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-\[52rem\] {
    max-width: 52rem;
  }
  .max-w-xl {
    max-width: var(--container-xl);
  }
  .min-w-0 {
    min-width: 0px;
  }
  .flex-1 {
    flex: 1;
  }
  .shrink-0 {
    flex-shrink: 0;
  }
  .cursor-pointer {
    cursor: pointer;
  }
  .resize-y {
    resize: vertical;
  }
  .\[scrollbar-width\:none\] {
    scrollbar-width: none;
  }
  .list-none {
    list-style-type: none;
  }
  .grid-cols-1 {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
  .grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .flex-col {
    flex-direction: column;
  }
  .flex-wrap {
    flex-wrap: wrap;
  }
  .content-start {
    align-content: flex-start;
  }
  .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;
  }
  .gap-0 {
    gap: 0px;
  }
  .gap-1 {
    gap: var(--spacing);
  }
  .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-10 {
    gap: calc(var(--spacing) * 10);
  }
  .gap-12 {
    gap: calc(var(--spacing) * 12);
  }
  .gap-14 {
    gap: calc(var(--spacing) * 14);
  }
  :where(.space-y-2\.5 > :not(:last-child)) {
    --tw-space-y-reverse: 0;
    margin-block-start: calc(calc(var(--spacing) * 2.5) * var(--tw-space-y-reverse));
    margin-block-end: calc(calc(var(--spacing) * 2.5) * calc(1 - var(--tw-space-y-reverse)));
  }
  :where(.space-y-4 > :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)));
  }
  :where(.space-y-5 > :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)));
  }
  :where(.space-y-6 > :not(:last-child)) {
    --tw-space-y-reverse: 0;
    margin-block-start: calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));
    margin-block-end: calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)));
  }
  .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-x-10 {
    column-gap: calc(var(--spacing) * 10);
  }
  .gap-x-12 {
    column-gap: calc(var(--spacing) * 12);
  }
  .gap-x-14 {
    column-gap: calc(var(--spacing) * 14);
  }
  .gap-x-16 {
    column-gap: calc(var(--spacing) * 16);
  }
  .gap-y-2 {
    row-gap: calc(var(--spacing) * 2);
  }
  .gap-y-4 {
    row-gap: calc(var(--spacing) * 4);
  }
  .gap-y-6 {
    row-gap: calc(var(--spacing) * 6);
  }
  .gap-y-8 {
    row-gap: calc(var(--spacing) * 8);
  }
  .gap-y-10 {
    row-gap: calc(var(--spacing) * 10);
  }
  .self-center {
    align-self: center;
  }
  .truncate {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .overflow-hidden {
    overflow: hidden;
  }
  .overflow-x-auto {
    overflow-x: auto;
  }
  .rounded-full {
    border-radius: calc(infinity * 1px);
  }
  .border {
    border-style: var(--tw-border-style);
    border-width: 1px;
  }
  .border-y {
    border-block-style: var(--tw-border-style);
    border-block-width: 1px;
  }
  .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-accent-text\/40 {
    border-color: var(--accent-text);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab, var(--accent-text) 40%, transparent);
    }
  }
  .border-border {
    border-color: var(--border);
  }
  .border-transparent {
    border-color: transparent;
  }
  .bg-background {
    background-color: var(--background);
  }
  .bg-inverse {
    background-color: var(--inverse);
  }
  .bg-muted {
    background-color: var(--muted);
  }
  .object-cover {
    object-fit: cover;
  }
  .p-4 {
    padding: calc(var(--spacing) * 4);
  }
  .p-5 {
    padding: calc(var(--spacing) * 5);
  }
  .p-6 {
    padding: calc(var(--spacing) * 6);
  }
  .p-7 {
    padding: calc(var(--spacing) * 7);
  }
  .px-3\.5 {
    padding-inline: calc(var(--spacing) * 3.5);
  }
  .py-1\.5 {
    padding-block: calc(var(--spacing) * 1.5);
  }
  .py-2 {
    padding-block: calc(var(--spacing) * 2);
  }
  .py-3\.5 {
    padding-block: calc(var(--spacing) * 3.5);
  }
  .py-4 {
    padding-block: calc(var(--spacing) * 4);
  }
  .py-5 {
    padding-block: calc(var(--spacing) * 5);
  }
  .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-14 {
    padding-block: calc(var(--spacing) * 14);
  }
  .py-32 {
    padding-block: calc(var(--spacing) * 32);
  }
  .pt-0\.5 {
    padding-top: calc(var(--spacing) * 0.5);
  }
  .pt-5 {
    padding-top: calc(var(--spacing) * 5);
  }
  .pt-6 {
    padding-top: calc(var(--spacing) * 6);
  }
  .pt-8 {
    padding-top: calc(var(--spacing) * 8);
  }
  .pt-10 {
    padding-top: calc(var(--spacing) * 10);
  }
  .pt-24 {
    padding-top: calc(var(--spacing) * 24);
  }
  .pt-32 {
    padding-top: calc(var(--spacing) * 32);
  }
  .pb-4 {
    padding-bottom: calc(var(--spacing) * 4);
  }
  .pb-6 {
    padding-bottom: calc(var(--spacing) * 6);
  }
  .pb-8 {
    padding-bottom: calc(var(--spacing) * 8);
  }
  .pb-14 {
    padding-bottom: calc(var(--spacing) * 14);
  }
  .text-center {
    text-align: center;
  }
  .text-left {
    text-align: left;
  }
  .text-right {
    text-align: right;
  }
  .align-middle {
    vertical-align: middle;
  }
  .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-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-\[0\.8125rem\] {
    font-size: 0.8125rem;
  }
  .text-\[0\.9375rem\] {
    font-size: 0.9375rem;
  }
  .leading-6 {
    --tw-leading: calc(var(--spacing) * 6);
    line-height: calc(var(--spacing) * 6);
  }
  .leading-7 {
    --tw-leading: calc(var(--spacing) * 7);
    line-height: calc(var(--spacing) * 7);
  }
  .leading-8 {
    --tw-leading: calc(var(--spacing) * 8);
    line-height: calc(var(--spacing) * 8);
  }
  .font-medium {
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
  }
  .tracking-\[0\.08em\] {
    --tw-tracking: 0.08em;
    letter-spacing: 0.08em;
  }
  .text-accent-text {
    color: var(--accent-text);
  }
  .text-foreground {
    color: var(--foreground);
  }
  .text-inverse-foreground {
    color: var(--inverse-foreground);
  }
  .text-muted-foreground {
    color: var(--muted-foreground);
  }
  .italic {
    font-style: italic;
  }
  .accent-primary {
    accent-color: var(--primary);
  }
  .opacity-60 {
    opacity: 60%;
  }
  .opacity-70 {
    opacity: 70%;
  }
  .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);
  }
  .outline {
    outline-style: var(--tw-outline-style);
    outline-width: 1px;
  }
  .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,);
  }
  .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,);
  }
  .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-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-300 {
    --tw-duration: 300ms;
    transition-duration: 300ms;
  }
  .duration-700 {
    --tw-duration: 700ms;
    transition-duration: 700ms;
  }
  .ease-out {
    --tw-ease: var(--ease-out);
    transition-timing-function: var(--ease-out);
  }
  .group-open\:rotate-45:is(:where(.group):is([open], :popover-open, :open) *) {
    rotate: 45deg;
  }
  @media (hover: hover) {
    .group-hover\:translate-x-1:is(:where(.group):hover *) {
      --tw-translate-x: var(--spacing);
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }
    .group-hover\:scale-\[1\.03\]:is(:where(.group):hover *) {
      scale: 1.03;
    }
  }
  .last\:border-0:last-child {
    border-style: var(--tw-border-style);
    border-width: 0px;
  }
  .last\:border-b:last-child {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
  }
  @media (hover: hover) {
    .hover\:border-foreground\/25:hover {
      border-color: var(--foreground);
    }
    @supports (color: color-mix(in lab, red, red)) {
      .hover\:border-foreground\/25:hover {
        border-color: color-mix(in oklab, var(--foreground) 25%, transparent);
      }
    }
    .hover\:bg-muted:hover {
      background-color: var(--muted);
    }
    .hover\:text-accent-text:hover {
      color: var(--accent-text);
    }
    .hover\:text-foreground:hover {
      color: var(--foreground);
    }
    .hover\:text-inverse-foreground:hover {
      color: var(--inverse-foreground);
    }
  }
  .focus\:not-sr-only:focus {
    position: static;
    width: auto;
    height: auto;
    padding: 0;
    margin: 0;
    overflow: visible;
    clip-path: none;
    white-space: normal;
  }
  .focus\:fixed:focus {
    position: fixed;
  }
  .focus\:top-4:focus {
    top: calc(var(--spacing) * 4);
  }
  .focus\:left-4:focus {
    left: calc(var(--spacing) * 4);
  }
  .focus\:z-\[60\]:focus {
    z-index: 60;
  }
  .focus\:rounded-full:focus {
    border-radius: calc(infinity * 1px);
  }
  .focus\:bg-primary:focus {
    background-color: var(--primary);
  }
  .focus\:px-4:focus {
    padding-inline: calc(var(--spacing) * 4);
  }
  .focus\:py-2:focus {
    padding-block: calc(var(--spacing) * 2);
  }
  .focus\:text-sm:focus {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
  }
  .focus\:text-primary-foreground:focus {
    color: var(--primary-foreground);
  }
  @media (width >= 40rem) {
    .sm\:order-none {
      order: 0;
    }
    .sm\:mt-2 {
      margin-top: calc(var(--spacing) * 2);
    }
    .sm\:block {
      display: block;
    }
    .sm\:hidden {
      display: none;
    }
    .sm\:aspect-\[21\/9\] {
      aspect-ratio: 21/9;
    }
    .sm\:w-\[23rem\] {
      width: 23rem;
    }
    .sm\:w-auto {
      width: auto;
    }
    .sm\:grid-cols-2 {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .sm\:grid-cols-3 {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    .sm\:grid-cols-\[1fr_14rem\] {
      grid-template-columns: 1fr 14rem;
    }
    .sm\:flex-row {
      flex-direction: row;
    }
    .sm\:items-center {
      align-items: center;
    }
    .sm\:justify-between {
      justify-content: space-between;
    }
    .sm\:justify-end {
      justify-content: flex-end;
    }
    .sm\:gap-4 {
      gap: calc(var(--spacing) * 4);
    }
    .sm\:gap-x-12 {
      column-gap: calc(var(--spacing) * 12);
    }
    .sm\:gap-y-10 {
      row-gap: calc(var(--spacing) * 10);
    }
    .sm\:gap-y-12 {
      row-gap: calc(var(--spacing) * 12);
    }
    .sm\:border-t-0 {
      border-top-style: var(--tw-border-style);
      border-top-width: 0px;
    }
    .sm\:border-l {
      border-left-style: var(--tw-border-style);
      border-left-width: 1px;
    }
    .sm\:p-10 {
      padding: calc(var(--spacing) * 10);
    }
    .sm\:py-0 {
      padding-block: 0px;
    }
    .sm\:py-28 {
      padding-block: calc(var(--spacing) * 28);
    }
    .sm\:py-40 {
      padding-block: calc(var(--spacing) * 40);
    }
    .sm\:pt-0 {
      padding-top: 0px;
    }
    .sm\:pt-6 {
      padding-top: calc(var(--spacing) * 6);
    }
    .sm\:pt-40 {
      padding-top: calc(var(--spacing) * 40);
    }
    .sm\:pr-14 {
      padding-right: calc(var(--spacing) * 14);
    }
    .sm\:pl-14 {
      padding-left: calc(var(--spacing) * 14);
    }
    .sm\:text-left {
      text-align: left;
    }
    .sm\:text-2xl {
      font-size: var(--text-2xl);
      line-height: var(--tw-leading, var(--text-2xl--line-height));
    }
    .sm\:text-3xl {
      font-size: var(--text-3xl);
      line-height: var(--tw-leading, var(--text-3xl--line-height));
    }
    .sm\:text-4xl {
      font-size: var(--text-4xl);
      line-height: var(--tw-leading, var(--text-4xl--line-height));
    }
    .sm\:text-5xl {
      font-size: var(--text-5xl);
      line-height: var(--tw-leading, var(--text-5xl--line-height));
    }
  }
  @media (width >= 48rem) {
    .md\:order-1 {
      order: 1;
    }
    .md\:order-2 {
      order: 2;
    }
    .md\:col-span-2 {
      grid-column: span 2 / span 2;
    }
    .md\:col-span-3 {
      grid-column: span 3 / span 3;
    }
    .md\:col-span-5 {
      grid-column: span 5 / span 5;
    }
    .md\:col-span-7 {
      grid-column: span 7 / span 7;
    }
    .md\:mt-16 {
      margin-top: calc(var(--spacing) * 16);
    }
    .md\:block {
      display: block;
    }
    .md\:inline-flex {
      display: inline-flex;
    }
    .md\:aspect-auto {
      aspect-ratio: auto;
    }
    .md\:grid-cols-2 {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .md\:grid-cols-5 {
      grid-template-columns: repeat(5, minmax(0, 1fr));
    }
    .md\:grid-cols-12 {
      grid-template-columns: repeat(12, minmax(0, 1fr));
    }
    :where(.md\:space-y-2\.5 > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 2.5) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 2.5) * calc(1 - var(--tw-space-y-reverse)));
    }
    :where(.md\:space-y-3 > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)));
    }
    .md\:p-10 {
      padding: calc(var(--spacing) * 10);
    }
    .md\:py-5 {
      padding-block: calc(var(--spacing) * 5);
    }
    .md\:py-12 {
      padding-block: calc(var(--spacing) * 12);
    }
    .md\:py-16 {
      padding-block: calc(var(--spacing) * 16);
    }
  }
  @media (width >= 64rem) {
    .lg\:sticky {
      position: sticky;
    }
    .lg\:top-24 {
      top: calc(var(--spacing) * 24);
    }
    .lg\:order-1 {
      order: 1;
    }
    .lg\:order-2 {
      order: 2;
    }
    .lg\:col-span-1 {
      grid-column: span 1 / span 1;
    }
    .lg\:col-span-2 {
      grid-column: span 2 / span 2;
    }
    .lg\:flex {
      display: flex;
    }
    .lg\:hidden {
      display: none;
    }
    .lg\:auto-cols-fr {
      grid-auto-columns: minmax(0, 1fr);
    }
    .lg\:grid-flow-col {
      grid-auto-flow: column;
    }
    .lg\:grid-cols-2 {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .lg\:grid-cols-3 {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    .lg\:grid-cols-4 {
      grid-template-columns: repeat(4, minmax(0, 1fr));
    }
    .lg\:grid-cols-\[1\.15fr_1fr\] {
      grid-template-columns: 1.15fr 1fr;
    }
    .lg\:gap-16 {
      gap: calc(var(--spacing) * 16);
    }
    .lg\:gap-20 {
      gap: calc(var(--spacing) * 20);
    }
    .lg\:gap-x-8 {
      column-gap: calc(var(--spacing) * 8);
    }
    .lg\:gap-y-10 {
      row-gap: calc(var(--spacing) * 10);
    }
    .lg\:self-start {
      align-self: flex-start;
    }
    .lg\:pt-2 {
      padding-top: calc(var(--spacing) * 2);
    }
  }
  .dark\:block:where(.dark, .dark *) {
    display: block;
  }
  .dark\:hidden:where(.dark, .dark *) {
    display: none;
  }
  .\[\&\:\:-webkit-scrollbar\]\:hidden::-webkit-scrollbar {
    display: none;
  }
  .\[\&\>iframe\]\:size-full > iframe {
    width: 100%;
    height: 100%;
  }
  .\[\&\>iframe\]\:border-0 > iframe {
    border-style: var(--tw-border-style);
    border-width: 0px;
  }
}
:root {
  --background: oklch(0.9851 0 0);
  --surface: oklch(1 0 0);
  --muted: oklch(0.9674 0.0013 286.4);
  --border: oklch(0.9197 0.004 286.3);
  --foreground: oklch(0.2103 0.0059 285.9);
  --muted-foreground: oklch(0.4419 0.0146 285.8);
  --primary: oklch(0.5529 0.2255 27.3);
  --primary-foreground: oklch(1 0 0);
  --accent-text: oklch(0.5529 0.2255 27.3);
  --ring: oklch(0.5529 0.2255 27.3);
  --ring-halo: oklch(1 0 0);
  --brand: #ff0000;
  --inverse: oklch(0.1408 0.0044 285.8);
  --inverse-foreground: oklch(0.9851 0 0);
  --inverse-muted-foreground: oklch(0.7118 0.0129 286.1);
  --inverse-border: oklch(0.2739 0.0055 286);
}
.dark {
  --background: oklch(0.1408 0.0044 285.8);
  --surface: oklch(0.1881 0.006 285.8);
  --muted: oklch(0.2277 0.0057 285.9);
  --border: oklch(0.2739 0.0055 286);
  --foreground: oklch(0.9851 0 0);
  --muted-foreground: oklch(0.7118 0.0129 286.1);
  --primary: oklch(0.5529 0.2255 27.3);
  --primary-foreground: oklch(1 0 0);
  --accent-text: oklch(0.6633 0.2236 28.3);
  --ring: oklch(0.6633 0.2236 28.3);
}
@layer base {
  *, *::before, *::after {
    border-color: var(--border);
  }
  html {
    scroll-behavior: smooth;
    scroll-padding-top: 5rem;
    -webkit-text-size-adjust: 100%;
  }
  @media (prefers-reduced-motion: reduce) {
    html {
      scroll-behavior: auto;
    }
  }
  body {
    background: var(--background);
    color: var(--foreground);
    font-family: var(--font-sans);
    font-size: 1.0625rem;
    line-height: 1.65;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
  }
  ::selection {
    background: var(--primary);
    @supports (color: color-mix(in lab, red, red)) {
      background: color-mix(in oklab, var(--primary) 24%, transparent);
    }
    color: var(--foreground);
  }
  :where(input, textarea) {
    caret-color: var(--primary);
  }
  html {
    scrollbar-color: var(--foreground) transparent;
    @supports (color: color-mix(in lab, red, red)) {
      scrollbar-color: color-mix(in oklab, var(--foreground) 22%, transparent) transparent;
    }
    scrollbar-width: thin;
  }
  ::-webkit-scrollbar {
    width: 10px;
    height: 10px;
  }
  ::-webkit-scrollbar-track {
    background: transparent;
  }
  ::-webkit-scrollbar-thumb {
    background: var(--foreground);
    @supports (color: color-mix(in lab, red, red)) {
      background: color-mix(in oklab, var(--foreground) 20%, transparent);
    }
    border: 3px solid transparent;
    border-radius: 999px;
    background-clip: content-box;
  }
  ::-webkit-scrollbar-thumb:hover {
    background: var(--foreground);
    @supports (color: color-mix(in lab, red, red)) {
      background: color-mix(in oklab, var(--foreground) 34%, transparent);
    }
    background-clip: content-box;
  }
  :focus-visible {
    outline: 2px solid var(--ring);
    outline-offset: 2px;
    box-shadow: 0 0 0 6px var(--ring-halo);
    border-radius: 4px;
  }
  :focus:not(:focus-visible) {
    outline: none;
  }
  ::marker {
    color: var(--muted-foreground);
  }
  a {
    text-underline-offset: 0.25em;
    text-decoration-thickness: from-font;
  }
  :where(th, td) {
    font-variant-numeric: tabular-nums;
  }
  img, video {
    max-width: 100%;
    height: auto;
  }
}
@layer components {
  .wrap {
    margin-inline: auto;
    width: 100%;
    max-width: 72rem;
    padding-inline: 1.25rem;
  }
  @media (min-width: 640px) {
    .wrap {
      padding-inline: 2rem;
    }
  }
  .rail {
    padding-inline: max(1.25rem, calc((100% - 72rem) / 2 + 1.25rem));
  }
  @media (min-width: 640px) {
    .rail {
      padding-inline: max(2rem, calc((100% - 72rem) / 2 + 2rem));
    }
  }
  .section {
    padding-block: 4rem;
  }
  @media (min-width: 768px) {
    .section {
      padding-block: 7rem;
    }
  }
  .hero-home {
    min-height: 78dvh;
  }
  .hero-page {
    min-height: 40vh;
  }
  .hero-service {
    min-height: 42vh;
  }
  .image-band-compact {
    min-height: 32vh;
  }
  .image-band-tall {
    min-height: 50vh;
  }
  @media (min-width: 768px) {
    .hero-home {
      min-height: 100dvh;
    }
    .hero-page {
      min-height: 52vh;
    }
    .hero-service {
      min-height: 56vh;
    }
    .image-band-compact {
      min-height: 45vh;
    }
    .image-band-tall {
      min-height: 70vh;
    }
  }
  .service-aside {
    order: -1;
  }
  @media (min-width: 1024px) {
    .service-aside {
      order: 0;
    }
  }
  .display {
    font-family: var(--font-display);
    font-weight: 600;
    letter-spacing: -0.03em;
    line-height: 1.08;
    text-wrap: balance;
  }
  .display-hero {
    font-size: clamp(2.25rem, 6vw, 4.5rem);
  }
  .display-section {
    font-size: clamp(1.75rem, 3.6vw, 3rem);
  }
  .display-card {
    font-size: clamp(1.125rem, 1.6vw, 1.375rem);
    letter-spacing: -0.02em;
    line-height: 1.3;
  }
  .cjk-phrase {
    word-break: keep-all;
    overflow-wrap: anywhere;
  }
  .measure {
    max-width: 34em;
  }
  .measure-tight {
    max-width: 26em;
  }
  .reading {
    margin-inline: auto;
    width: 100%;
    max-width: 42rem;
  }
  .nums {
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.02em;
  }
  .stat-cell {
    container-type: inline-size;
  }
  .stat-number {
    font-size: 1.75rem;
    line-height: 1;
    white-space: nowrap;
  }
  @media (min-width: 640px) {
    .stat-number {
      font-size: clamp(1.75rem, 15.5cqi, 3rem);
    }
  }
  .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    border-radius: 999px;
    padding: 0.75rem 1.5rem;
    font-size: 0.9375rem;
    font-weight: 500;
    line-height: 1.2;
    white-space: nowrap;
    transition: background-color 0.2s, border-color 0.2s, color 0.2s, transform 0.12s;
  }
  .btn:active {
    transform: scale(0.98);
  }
  .btn-primary {
    background: var(--primary);
    color: var(--primary-foreground);
  }
  .btn-primary:hover {
    background: var(--primary);
    @supports (color: color-mix(in lab, red, red)) {
      background: color-mix(in oklab, var(--primary) 88%, black);
    }
  }
  .btn-secondary {
    background: transparent;
    color: var(--foreground);
    border: 1px solid var(--foreground);
    @supports (color: color-mix(in lab, red, red)) {
      border: 1px solid color-mix(in oklab, var(--foreground) 22%, transparent);
    }
  }
  .btn-secondary:hover {
    border-color: var(--foreground);
  }
  .btn-on-inverse {
    background: transparent;
    color: var(--inverse-foreground);
    border: 1px solid var(--inverse-foreground);
    @supports (color: color-mix(in lab, red, red)) {
      border: 1px solid color-mix(in oklab, var(--inverse-foreground) 32%, transparent);
    }
  }
  .btn-on-inverse:hover {
    border-color: var(--inverse-foreground);
    background: var(--inverse-foreground);
    @supports (color: color-mix(in lab, red, red)) {
      background: color-mix(in oklab, var(--inverse-foreground) 8%, transparent);
    }
  }
  .btn-sm {
    padding: 0.5rem 1rem;
    font-size: 0.875rem;
  }
  @media (pointer: coarse) {
    .btn-sm {
      min-height: 2.5rem;
    }
    .tap-row {
      position: relative;
    }
    .tap-row::after {
      content: "";
      position: absolute;
      inset: -0.5rem 0;
    }
  }
  .link-arrow {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.9375rem;
    font-weight: 500;
    color: var(--accent-text);
  }
  .link-arrow svg {
    transition: transform 0.25s var(--ease-out-expo);
  }
  .link-arrow:hover svg {
    transform: translateX(0.25rem);
  }
  .panel {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius);
  }
  .panel-muted {
    background: var(--muted);
    border: 1px solid var(--border);
    border-radius: var(--radius);
  }
  .media {
    border-radius: var(--radius);
    overflow: hidden;
    background: var(--muted);
  }
  .hairline {
    border-top: 1px solid var(--border);
  }
  .inverse {
    background: var(--inverse);
    color: var(--inverse-foreground);
  }
  .scrim {
    background: linear-gradient( to right, var(--inverse) 0%, var(--inverse) 45%, var(--inverse) 100% );
    @supports (color: color-mix(in lab, red, red)) {
      background: linear-gradient( to right, color-mix(in oklab, var(--inverse) 92%, transparent) 0%, color-mix(in oklab, var(--inverse) 74%, transparent) 45%, color-mix(in oklab, var(--inverse) 25%, transparent) 100% );
    }
  }
  .cta-band {
    background: var(--inverse);
  }
  html:not(.dark) .cta-band {
    --foreground: var(--inverse-foreground);
    --muted-foreground: var(--inverse-muted-foreground);
    --border: var(--inverse-border);
    color: var(--inverse-foreground);
  }
  .dark .cta-band {
    background: var(--muted);
  }
  .text-on-image {
    color: color-mix(in oklab, white 88%, transparent);
  }
  .scrim-bottom {
    background: linear-gradient( to top, var(--inverse) 0%, var(--inverse) 38%, var(--inverse) 72%, transparent 100% );
    @supports (color: color-mix(in lab, red, red)) {
      background: linear-gradient( to top, color-mix(in oklab, var(--inverse) 90%, transparent) 0%, color-mix(in oklab, var(--inverse) 66%, transparent) 38%, color-mix(in oklab, var(--inverse) 18%, transparent) 72%, transparent 100% );
    }
  }
  .field-label {
    display: block;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--foreground);
    margin-bottom: 0.5rem;
  }
  .field-input {
    display: block;
    width: 100%;
    background: var(--surface);
    color: var(--foreground);
    border: 1px solid var(--foreground);
    @supports (color: color-mix(in lab, red, red)) {
      border: 1px solid color-mix(in oklab, var(--foreground) 20%, transparent);
    }
    border-radius: var(--radius-sm);
    padding: 0.6875rem 0.875rem;
    font-size: 1rem;
    font-family: inherit;
    transition: border-color 0.2s;
  }
  .field-input::placeholder {
    color: var(--muted-foreground);
  }
  .field-input:hover {
    border-color: var(--foreground);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab, var(--foreground) 36%, transparent);
    }
  }
  .field-input[aria-invalid="true"] {
    border-color: var(--accent-text);
  }
  .field-help {
    margin-top: 0.375rem;
    font-size: 0.8125rem;
    color: var(--muted-foreground);
  }
  .field-error {
    margin-top: 0.375rem;
    font-size: 0.8125rem;
    color: var(--accent-text);
    font-weight: 500;
  }
  .prose {
    color: var(--foreground);
    @supports (color: color-mix(in lab, red, red)) {
      color: color-mix(in oklab, var(--foreground) 88%, var(--background));
    }
    font-size: 1.0625rem;
    line-height: 1.8;
  }
  .prose > * + * {
    margin-top: 1.25em;
  }
  .prose h2 {
    font-family: var(--font-display);
    font-size: 1.5rem;
    font-weight: 600;
    letter-spacing: -0.02em;
    line-height: 1.3;
    color: var(--foreground);
    margin-top: 2.5em;
  }
  .prose h3 {
    font-size: 1.1875rem;
    font-weight: 600;
    color: var(--foreground);
    margin-top: 2em;
  }
  .prose h2 + *, .prose h3 + * {
    margin-top: 0.75em;
  }
  .prose :where(ul, ol) {
    padding-left: 1.5em;
  }
  .prose ul {
    list-style: disc;
  }
  .prose ol {
    list-style: decimal;
  }
  .prose li + li {
    margin-top: 0.5em;
  }
  .prose a {
    color: var(--accent-text);
    text-decoration: underline;
  }
  .prose strong {
    font-weight: 600;
    color: var(--foreground);
  }
  .prose blockquote {
    padding-left: 1.25em;
    border-left: 1px solid var(--border);
    color: var(--muted-foreground);
  }
  .prose img {
    border-radius: var(--radius);
  }
  .prose code {
    background: var(--muted);
    border-radius: 6px;
    padding: 0.15em 0.4em;
    font-size: 0.9em;
  }
  .prose table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9375rem;
  }
  .prose :where(th, td) {
    text-align: left;
    padding: 0.75em 1em;
    border-bottom: 1px solid var(--border);
  }
  .prose th {
    font-weight: 600;
    color: var(--foreground);
  }
}
@layer utilities {
  .reveal {
    opacity: 0;
    transform: translateY(1rem);
    transition: opacity 0.7s var(--ease-out-expo), transform 0.7s var(--ease-out-expo);
    transition-delay: calc(var(--reveal-index, 0) * 70ms);
  }
  .reveal.is-visible {
    opacity: 1;
    transform: none;
  }
  .process-line {
    position: absolute;
    left: 0;
    top: 7px;
    height: 1px;
    width: 100%;
    background: var(--border);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.9s var(--ease-out-expo);
    transition-delay: calc(var(--reveal-index, 0) * 140ms);
  }
  .process-dot {
    position: relative;
    display: block;
    width: 15px;
    height: 15px;
    border: 2px solid var(--accent-text);
    border-radius: 999px;
    background: var(--background);
    transform: scale(0);
    transition: transform 0.5s var(--ease-out-expo);
    transition-delay: calc(var(--reveal-index, 0) * 140ms + 260ms);
  }
  .reveal.is-visible .process-line {
    transform: scaleX(1);
  }
  .reveal.is-visible .process-dot {
    transform: scale(1);
  }
  @media (prefers-reduced-motion: reduce) {
    .process-line, .process-dot {
      transform: none;
      transition: none;
    }
  }
  @supports (animation-timeline: scroll()) {
    @media (prefers-reduced-motion: no-preference) {
      .hero-parallax {
        animation: hero-recede linear both;
        animation-timeline: scroll(root block);
        animation-range: 0 90vh;
        will-change: transform, opacity;
      }
    }
  }
  @keyframes hero-recede {
    to {
      transform: scale(1.12) translateY(2.5rem);
      opacity: 0.5;
    }
  }
  @supports (animation-timeline: view()) {
    @media (prefers-reduced-motion: no-preference) {
      .media-burst {
        animation: media-burst linear both;
        animation-timeline: view(block);
        animation-range: entry 0% cover 42%;
        will-change: transform;
      }
      .media-drift {
        animation: media-drift linear both;
        animation-timeline: view(block);
        animation-range: cover 0% cover 100%;
        will-change: transform;
      }
    }
  }
  @keyframes media-burst {
    from {
      transform: scale(1.34);
    }
    to {
      transform: scale(1);
    }
  }
  @keyframes media-drift {
    from {
      transform: scale(1.14) translateY(-5%);
    }
    to {
      transform: scale(1.14) translateY(7%);
    }
  }
  @supports not (animation-timeline: view()) {
    @media (prefers-reduced-motion: no-preference) {
      .media-burst {
        transform: scale(1.24);
        transition: transform 1.15s var(--ease-out-expo);
      }
      .reveal.is-visible .media-burst, .is-visible.media-burst {
        transform: scale(1);
      }
    }
  }
  @media (prefers-reduced-motion: reduce) {
    .reveal {
      opacity: 1;
      transform: none;
      transition: none;
    }
    *, *::before, *::after {
      animation-duration: 0.01ms !important;
      animation-iteration-count: 1 !important;
      transition-duration: 0.01ms !important;
    }
  }
}
#site-header {
  background: var(--background);
  @supports (color: color-mix(in lab, red, red)) {
    background: color-mix(in oklab, var(--background) 76%, transparent);
  }
  backdrop-filter: saturate(180%) blur(20px);
  -webkit-backdrop-filter: saturate(180%) blur(20px);
}
#site-header.is-scrolled {
  border-bottom-color: var(--border);
}
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  #site-header {
    background: var(--background);
  }
}
body.hero-top:not(.menu-open) #site-header {
  --foreground: var(--inverse-foreground);
  --muted-foreground: color-mix(in oklab, white 88%, transparent);
  --muted: color-mix(in oklab, white 16%, transparent);
  --border: var(--inverse-border);
  color: var(--inverse-foreground);
  background: transparent;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  border-bottom-color: transparent;
}
body.hero-top:not(.menu-open) #site-header::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  z-index: -1;
  height: 10rem;
  pointer-events: none;
  background: linear-gradient( to bottom, color-mix(in oklab, black 55%, transparent) 0%, color-mix(in oklab, black 26%, transparent) 45%, transparent 100% );
}
body.menu-open #site-header {
  background: var(--background);
}
body.menu-open {
  overflow: hidden;
}
#mobile-menu {
  max-height: calc(100dvh - 3.5rem);
  overflow-y: auto;
  overscroll-behavior: contain;
  padding-bottom: env(safe-area-inset-bottom, 0px);
}
#mobile-menu:not(.hidden) {
  animation: menu-drop 0.24s var(--ease-out-expo) both;
}
@keyframes menu-drop {
  from {
    opacity: 0;
    transform: translateY(-0.5rem);
  }
}
@media (prefers-reduced-motion: reduce) {
  #mobile-menu:not(.hidden) {
    animation: none;
  }
}
.logo-dark, .dark .logo-light, body.hero-top:not(.menu-open) .logo-light {
  display: none;
}
.dark .logo-dark, body.hero-top:not(.menu-open) .logo-dark {
  display: block;
}
.theme-icon-to-dark {
  display: block;
}
.theme-icon-to-light {
  display: none;
}
.dark .theme-icon-to-dark {
  display: none;
}
.dark .theme-icon-to-light {
  display: block;
}
.feature-video {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.standards-item > summary {
  list-style: none;
}
.standards-item > summary::-webkit-details-marker {
  display: none;
}
.standards-item[open] > .standards-toggle svg {
  transform: rotate(45deg);
}
.standards-item > .standards-details {
  margin-top: 1rem;
}
@media (min-width: 768px) {
  .standards-toggle {
    display: none;
  }
  .standards-item > .standards-details {
    display: grid;
    margin-top: 0;
  }
  .standards-item::details-content {
    display: block;
    content-visibility: visible;
  }
}
.wechat-qr {
  width: 7rem;
  height: 7rem;
  object-fit: cover;
  border-radius: var(--radius-sm);
}
.privacy-photo {
  aspect-ratio: 16 / 9;
  max-height: 16rem;
}
@media (min-width: 640px) {
  .privacy-photo {
    max-height: 20rem;
  }
}
.privacy-extra {
  display: none;
}
@media (min-width: 640px) {
  .privacy-extra {
    display: flex;
  }
}
.privacy-pledge:has(+ .privacy-more[open]) .privacy-extra {
  display: flex;
}
.privacy-more > summary {
  list-style: none;
  cursor: pointer;
}
.privacy-more > summary::-webkit-details-marker {
  display: none;
}
.privacy-more .when-open {
  display: none;
}
.privacy-more[open] .when-closed {
  display: none;
}
.privacy-more[open] .when-open {
  display: inline;
}
.kicker {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0.18em;
  color: var(--muted-foreground);
}
.kicker::before {
  content: "";
  flex: 0 0 auto;
  width: 1.5rem;
  height: 2px;
  background: var(--primary);
}
.stage .kicker, .inverse .kicker, .on-image .kicker {
  color: var(--inverse-muted-foreground);
}
.section-mark {
  display: block;
  width: 1.5rem;
  height: 2px;
  margin-bottom: 1.1rem;
  background: var(--primary);
}
.section-mark--center {
  margin-inline: auto;
}
.tech {
  --foreground: var(--inverse-foreground);
  --muted-foreground: var(--inverse-muted-foreground);
  --border: var(--inverse-border);
  --tech-max: 5.75rem;
  background: var(--inverse);
  color: var(--inverse-foreground);
  padding-block: 5.5rem;
}
@media (min-width: 768px) {
  .tech {
    padding-block: 8.5rem;
    --tech-max: min(12.5rem, 21vw);
  }
}
.tech-lineup {
  display: grid;
  margin-top: 3rem;
}
@media (min-width: 768px) {
  .tech-lineup {
    grid-auto-columns: 1fr;
    grid-auto-flow: column;
    gap: 2.5rem;
    margin-top: 4.5rem;
  }
}
.tech-item {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  padding-block: 1.5rem;
  border-top: 1px solid var(--inverse-border);
}
.tech-item:last-child {
  border-bottom: 1px solid var(--inverse-border);
}
@media (min-width: 768px) {
  .tech-item {
    flex-direction: column;
    align-items: stretch;
    gap: 2rem;
    padding: 0;
    border: 0;
  }
  .tech-item:last-child {
    border: 0;
  }
}
.tech-stand {
  position: relative;
  display: flex;
  flex: 0 0 auto;
  align-items: flex-end;
  justify-content: center;
  width: var(--tech-max);
  height: calc(var(--tech-max) * 1.307);
}
@media (min-width: 768px) {
  .tech-stand {
    width: auto;
    padding-bottom: 1.25rem;
    height: calc(var(--tech-max) * 1.307 + 1.25rem);
    border-bottom: 1px solid var(--inverse-border);
  }
  .tech-stand::after {
    content: "";
    position: absolute;
    bottom: 0.4rem;
    left: 50%;
    width: calc(var(--tech-max) * 1.1);
    height: 1.2rem;
    border-radius: 50%;
    background: radial-gradient(closest-side, rgb(0 0 0 / 0.75), transparent);
    transform: translateX(-50%);
  }
}
.tech-device {
  position: relative;
  z-index: 1;
  container-type: inline-size;
  width: calc(var(--tech-max) * var(--mm-w) / 215.5);
  aspect-ratio: var(--mm-w) / var(--mm-h);
  padding: var(--bezel);
  border: 1px solid rgb(255 255 255 / 0.16);
  border-radius: 7.5% / calc(7.5% * var(--mm-w) / var(--mm-h));
  background: linear-gradient(150deg, #3b3c42 0%, #1d1e22 60%, #26272c 100%);
  box-shadow: 0 30px 60px rgb(0 0 0 / 0.55), inset 0 0 0 1.5px rgb(0 0 0 / 0.55);
}
.tech-device--air {
  --mm-w: 174.1;
  --mm-h: 250.6;
  --bezel: 11.5% 5.8%;
  --screen-radius: 0.6cqi;
}
.tech-device--pro2018 {
  --mm-w: 178.5;
  --mm-h: 247.6;
  --bezel: 4.4%;
  --screen-radius: 4.6cqi;
}
.tech-device--prom4 {
  --mm-w: 215.5;
  --mm-h: 281.6;
  --bezel: 3.2%;
  --screen-radius: 4cqi;
}
.tech-screen {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  overflow: hidden;
  border-radius: var(--screen-radius);
  background: linear-gradient(180deg, #121216 0%, #070708 100%);
}
.tech-screen::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(120% 70% at 50% 115%, rgb(226 60 74 / 0.55), transparent 62%), radial-gradient(90% 50% at 50% -10%, rgb(255 255 255 / 0.08), transparent 70%);
  opacity: 0;
  transition: opacity 1.1s var(--ease-out-expo);
  transition-delay: calc(var(--reveal-index, 0) * 140ms + 250ms);
}
.tech-year {
  position: relative;
  font-family: var(--font-display);
  font-size: 23cqi;
  font-weight: 600;
  letter-spacing: -0.04em;
  color: var(--inverse-foreground);
  opacity: 0;
  transform: translateY(6%);
  transition: opacity 0.9s var(--ease-out-expo), transform 0.9s var(--ease-out-expo);
  transition-delay: calc(var(--reveal-index, 0) * 140ms + 350ms);
}
.reveal.is-visible .tech-screen::before, .reveal.is-visible .tech-year {
  opacity: 1;
  transform: none;
}
.tech-cam {
  position: absolute;
  top: 2.2%;
  left: 50%;
  width: 2.6cqi;
  aspect-ratio: 1;
  border-radius: 999px;
  background: #0b0b0d;
  box-shadow: inset 0 0 0 0.6px rgb(255 255 255 / 0.18);
  transform: translate(-50%, -50%);
}
.tech-device--air .tech-cam {
  top: 5.6%;
}
.tech-device--pro2018 .tech-cam {
  top: 2.2%;
}
.tech-device--prom4 .tech-cam {
  top: 50%;
  left: auto;
  right: 0.3%;
  transform: translate(0, -50%);
}
.tech-home {
  position: absolute;
  bottom: 5.75%;
  left: 50%;
  width: 9cqi;
  aspect-ratio: 1;
  border: 1px solid rgb(255 255 255 / 0.22);
  border-radius: 999px;
  transform: translate(-50%, 50%);
}
.tech-copy {
  min-width: 0;
}
.tech-name {
  font-family: var(--font-display);
  font-size: clamp(1.125rem, 2vw, 1.5rem);
  font-weight: 600;
  letter-spacing: -0.02em;
  line-height: 1.25;
  color: var(--inverse-foreground);
}
.tech-claim {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  margin-top: 0.5rem;
  font-size: 1rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: #ff6961;
}
.tech-claim::before {
  content: "";
  width: 1rem;
  height: 2px;
  border-radius: 999px;
  background: currentColor;
}
.tech-note {
  margin-top: 0.6rem;
  font-size: 0.9375rem;
  line-height: 1.7;
  color: var(--inverse-muted-foreground);
}
.tech-link {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.75rem 1.35rem;
  border: 1px solid rgb(255 255 255 / 0.22);
  border-radius: 999px;
  font-size: 0.9375rem;
  font-weight: 500;
  color: var(--inverse-foreground);
  transition: background-color 0.2s ease, border-color 0.2s ease;
}
.tech-link:hover {
  border-color: rgb(255 255 255 / 0.4);
  background: rgb(255 255 255 / 0.06);
}
.tech-link span {
  transition: transform 0.2s var(--ease-out-expo);
}
.tech-link:hover span {
  transform: translateX(3px);
}
@media (prefers-reduced-motion: reduce) {
  .tech-screen::before, .tech-year {
    opacity: 1;
    transform: none;
    transition: none;
  }
}
.stage {
  --stage-p: 0;
  --stage-beat: 0;
  --stage-fill: 0.2;
  --mem-meter: 0.59;
  --mem-grow: 0;
  --mem-swap: 0;
  --mem-out: 0;
  --mem-in: 0;
  --mem-solder: 0;
  --batt-new: 0;
  --batt-shift: 0;
  --batt-vis: 1;
  --rp-scan: 0;
  --rp-scan-opacity: 0;
  --rp-fault: 0;
  --rp-out: 0;
  --rp-in: 0;
  --rp-solder: 0;
  --rp-live: 0;
  --stage-lift: 1;
  --stage-lock: 0;
  --stage-frost: 0;
  background: var(--inverse);
  color: var(--inverse-foreground);
}
.stage-runway {
  height: 300vh;
  min-height: 2100px;
}
@media (min-width: 768px) {
  .stage-runway {
    height: 340vh;
    min-height: 2600px;
  }
}
.stage--privacy.stage--full .stage-runway {
  height: 210vh;
  min-height: 1500px;
}
.stage--privacy.stage--coda .stage-runway {
  height: 160vh;
  min-height: 1100px;
}
@media (min-width: 768px) {
  .stage--privacy.stage--full .stage-runway {
    height: 240vh;
    min-height: 1800px;
  }
  .stage--privacy.stage--coda .stage-runway {
    height: 180vh;
    min-height: 1300px;
  }
}
.stage-pin {
  position: sticky;
  top: 0;
  display: flex;
  flex-direction: column;
  height: 100dvh;
  overflow: hidden;
}
.stage-copy {
  position: relative;
  z-index: 2;
  flex: 0 0 auto;
  min-height: 28vh;
  padding: 5.5rem 1.25rem 0.75rem;
}
@media (min-width: 640px) {
  .stage-copy {
    padding-inline: 2rem;
  }
}
@media (min-width: 768px) {
  .stage-copy {
    min-height: 32vh;
    padding-top: 6.5rem;
  }
}
.stage-kick {
  margin-inline: auto;
  max-width: 40rem;
  margin-bottom: 1.35rem;
}
.stage-copy .kicker {
  width: fit-content;
  padding: 0.5rem 1.15rem 0.5rem 0.95rem;
  border: 1px solid var(--inverse-foreground);
  @supports (color: color-mix(in lab, red, red)) {
    border: 1px solid color-mix(in oklab, var(--inverse-foreground) 22%, transparent);
  }
  border-radius: 999px;
  background: var(--inverse-foreground);
  @supports (color: color-mix(in lab, red, red)) {
    background: color-mix(in oklab, var(--inverse-foreground) 7%, transparent);
  }
  backdrop-filter: blur(8px);
  font-size: 0.9375rem;
  font-weight: 600;
  letter-spacing: 0.24em;
  text-indent: 0.06em;
  color: var(--inverse-foreground);
  box-shadow: 0 10px 30px rgb(0 0 0 / 0.35);
}
.stage-copy .kicker::before {
  box-shadow: 0 0 12px var(--primary);
  @supports (color: color-mix(in lab, red, red)) {
    box-shadow: 0 0 12px color-mix(in srgb, var(--primary) 80%, transparent);
  }
}
.stage-beats {
  position: relative;
  margin-inline: auto;
  max-width: 40rem;
  min-height: 6.5rem;
}
.stage-beat {
  position: absolute;
  inset-inline: 0;
  top: 0;
  opacity: 0;
  transform: translateY(0.45rem);
  filter: blur(4px);
  transition: opacity 0.55s var(--ease-out-expo), transform 0.55s var(--ease-out-expo), filter 0.55s var(--ease-out-expo);
  pointer-events: none;
}
.stage-beat.is-active {
  opacity: 1;
  transform: none;
  filter: none;
  pointer-events: auto;
}
.stage-beat-title {
  font-size: clamp(1.75rem, 4vw, 3rem);
  color: var(--inverse-foreground);
}
.stage-beat-caption {
  margin-top: 0.75rem;
  max-width: 22em;
  font-size: 1.0625rem;
  line-height: 1.65;
  color: var(--inverse-muted-foreground);
}
.stage-canvas {
  position: relative;
  display: flex;
  flex: 1 1 auto;
  align-items: flex-end;
  justify-content: center;
  min-height: 38vh;
  padding-bottom: 2.25rem;
}
.stage--memory .stage-canvas, .stage--battery .stage-canvas, .stage--power .stage-canvas {
  align-items: center;
}
.stage-progress {
  position: absolute;
  right: 0;
  bottom: env(safe-area-inset-bottom, 0px);
  left: 0;
  z-index: 3;
  height: 1px;
  background: var(--inverse-border);
}
.stage-progress-fill {
  display: block;
  width: calc(var(--stage-p) * 100%);
  height: 100%;
  background: var(--inverse-foreground);
  transition: width 90ms linear;
}
@media (prefers-reduced-motion: reduce) {
  .stage-progress-fill {
    transition: none;
  }
}
.stage-scene {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: min(64rem, 100%);
}
.stage-scene--memory {
  height: min(56vh, 30rem);
}
.stage-mem-glow {
  position: absolute;
  width: min(56rem, 98vw);
  height: 82%;
  border-radius: 50%;
  background: radial-gradient(closest-side, rgb(226 60 74 / 0.18), transparent 72%);
  opacity: calc(0.35 + var(--mem-grow) * 0.65);
  filter: blur(6px);
  transform: scale(calc(0.86 + var(--mem-grow) * 0.14));
}
.stage-mem-phone {
  position: relative;
  z-index: 2;
  width: min(44rem, 92vw);
  aspect-ratio: 19.5 / 9;
  border: 1px solid var(--inverse-border);
  border-radius: 2.2rem;
  background: #050506;
  box-shadow: 0 26px 70px rgb(0 0 0 / 0.55);
}
.stage--memory[data-device="ipad"] .stage-mem-phone {
  width: min(32rem, 88vw);
  aspect-ratio: 4 / 3;
  border-radius: 1.5rem;
}
.stage-mem-phone .stage-island {
  top: 50%;
  left: 3.4%;
  width: 1.5%;
  height: 26%;
  transform: translateY(-50%);
}
.stage--memory[data-device="ipad"] .stage-island {
  display: none;
}
.stage-mem-phone.is-settling {
  animation: stage-mem-settle 600ms var(--ease-out-expo);
}
@keyframes stage-mem-settle {
  0% {
    transform: scale(0.985);
    filter: brightness(1.6);
  }
  100% {
    transform: scale(1);
    filter: brightness(1);
  }
}
.stage-mem-screen {
  position: absolute;
  inset: 0.5rem;
  overflow: hidden;
  border-radius: 1.75rem;
  background: radial-gradient(105% 130% at 18% 120%, rgb(226 60 74 / calc(var(--mem-meter) * 0.42)), transparent 62%), rgb(4 4 5 / 0.97);
}
.stage-mem-ui {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: clamp(0.9rem, 3vw, 2.5rem);
  padding: 0 6% 0 9%;
  opacity: calc(1 - var(--mem-swap) * 0.94);
  filter: blur(calc(var(--mem-swap) * 6px));
  transform: scale(calc(1 - var(--mem-swap) * 0.03));
}
.stage-mem-cap-col {
  display: flex;
  flex: 0 0 auto;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.55rem;
}
.stage-mem-tally {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 0.6rem;
  max-width: 56%;
  font-size: clamp(0.625rem, 1.5vw, 0.8125rem);
  letter-spacing: 0.04em;
  color: var(--inverse-muted-foreground);
}
.stage-mem-tally li {
  display: flex;
  align-items: center;
  gap: 0.55rem;
}
.stage-mem-tally li > span {
  flex: 0 0 auto;
  min-width: 2.2em;
}
.stage-mem-tally b {
  flex: 0 0 auto;
  min-width: 4.6em;
  font-weight: 600;
  text-align: right;
  color: var(--inverse-foreground);
}
.stage-mem-bar {
  position: relative;
  flex: 1 1 auto;
  height: 2px;
  overflow: hidden;
  border-radius: 999px;
  background: rgb(255 255 255 / 0.12);
}
.stage-mem-bar i {
  display: block;
  width: calc(clamp(0, calc(var(--mem-grow) * var(--k, 1)), 1) * 100%);
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #e23c4a, #ff8a5c);
}
@media (max-width: 640px) {
  .stage-mem-bar {
    display: none;
  }
}
.stage-mem-label {
  font-size: 0.625rem;
  font-weight: 500;
  letter-spacing: 0.3em;
  text-indent: 0.3em;
  color: var(--inverse-muted-foreground);
}
.stage-mem-cap {
  font-family: var(--font-display);
  font-size: clamp(2.1rem, 6vw, 3.4rem);
  font-weight: 600;
  letter-spacing: -0.03em;
  line-height: 1;
  color: var(--inverse-foreground);
}
.stage-mem-cap i {
  font-size: 0.45em;
  font-style: normal;
  color: var(--inverse-muted-foreground);
}
.stage-mem-meter {
  width: 100%;
  min-width: 6.5rem;
  height: 3px;
  overflow: hidden;
  border-radius: 999px;
  background: rgb(255 255 255 / 0.12);
}
.stage-mem-meter i {
  display: block;
  width: calc(var(--mem-meter) * 100%);
  height: 100%;
  border-radius: inherit;
  background: linear-gradient( 90deg, #e2606c 0 56%, #6c72d9 56% 84%, #f8274b 84% 100% );
  transition: width 0.45s var(--ease-out-expo);
}
.stage-mem-meter {
  height: 5px;
}
.stage-mem-status {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.6875rem;
  letter-spacing: 0.08em;
  color: var(--inverse-muted-foreground);
  transition: color 0.3s ease;
}
.stage-mem-status::before {
  content: "";
  width: 0.4rem;
  height: 0.4rem;
  border-radius: 999px;
  background: #34c759;
  transition: background-color 0.3s ease, box-shadow 0.3s ease;
}
.stage-mem-status.is-full {
  color: #ff6961;
}
.stage-mem-status.is-full::before {
  background: #ff453a;
  box-shadow: 0 0 10px 2px rgb(255 69 58 / 0.6);
}
.stage-mem-board {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: var(--mem-swap);
  background: radial-gradient(60% 80% at 50% 50%, rgb(255 255 255 / 0.05), transparent 70%), #0b0c0e;
}
.stage-mem-traces {
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(90deg, transparent 0 22px, rgb(201 140 82 / 0.16) 22px 23px), repeating-linear-gradient(0deg, transparent 0 30px, rgb(201 140 82 / 0.1) 30px 31px);
  -webkit-mask-image: radial-gradient(70% 90% at 50% 50%, #000 30%, transparent 80%);
  mask-image: radial-gradient(70% 90% at 50% 50%, #000 30%, transparent 80%);
}
.stage-mem-pad, .stage-chip {
  position: absolute;
  top: 50%;
  left: 50%;
  width: clamp(4.6rem, 22%, 9.5rem);
  aspect-ratio: 1.3;
  border-radius: 0.45rem;
}
.stage-mem-pad {
  transform: translate(-50%, -58%);
  border: 1px solid rgb(201 140 82 / 0.35);
  background: radial-gradient(circle, rgb(214 214 220 / 0.55) 0 1.6px, transparent 2.2px) 0 0 / 9px 9px;
}
.stage-chip {
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.15rem;
  border: 1px solid rgb(255 255 255 / 0.16);
  background: linear-gradient(155deg, #2b2d33 0%, #15161a 100%);
  box-shadow: 0 14px 30px rgb(0 0 0 / 0.6), inset 0 1px 0 rgb(255 255 255 / 0.12);
  color: var(--inverse-foreground);
}
.stage-chip b {
  font-family: var(--font-display);
  font-size: clamp(0.85rem, 2.2vw, 1.35rem);
  font-weight: 600;
  letter-spacing: -0.02em;
}
.stage-chip i {
  font-size: clamp(0.5rem, 1vw, 0.625rem);
  font-style: normal;
  letter-spacing: 0.24em;
  text-indent: 0.24em;
  color: var(--inverse-muted-foreground);
}
.stage-chip--old {
  opacity: calc(1 - var(--mem-out));
  transform: translate(-50%, calc(-58% - var(--mem-out) * 90%)) rotate(calc(var(--mem-out) * -6deg));
}
.stage-chip--new {
  border-color: var(--primary);
  @supports (color: color-mix(in lab, red, red)) {
    border-color: color-mix(in oklab, var(--primary) 70%, white);
  }
  box-shadow: 0 14px 30px rgb(0 0 0 / 0.6), 0 0 0 1px rgb(226 60 74 / 0.25), 0 0 26px rgb(226 60 74 / calc(var(--mem-solder) * 0.9));
  opacity: var(--mem-in);
  transform: translate(-50%, calc(-58% - (1 - var(--mem-in)) * 90%)) scale(calc(1.08 - var(--mem-in) * 0.08));
}
.stage-mem-flash {
  position: absolute;
  top: 50%;
  left: 50%;
  width: clamp(7rem, 34%, 14rem);
  aspect-ratio: 1.3;
  border-radius: 50%;
  background: radial-gradient(closest-side, rgb(255 214 150 / 0.75), transparent 70%);
  opacity: var(--mem-solder);
  transform: translate(-50%, -58%);
  mix-blend-mode: plus-lighter;
  pointer-events: none;
}
.stage-mem-step {
  position: absolute;
  bottom: 9%;
  left: 0;
  right: 0;
  font-size: clamp(0.625rem, 1.4vw, 0.8125rem);
  letter-spacing: 0.12em;
  text-align: center;
  color: var(--inverse-muted-foreground);
}
.stage-mem-used {
  font-size: 0.6875rem;
  letter-spacing: 0.12em;
  color: var(--inverse-muted-foreground);
}
.stage-mem-used b {
  font-weight: 600;
  color: var(--inverse-foreground);
}
.stage-swatch {
  flex: 0 0 auto;
  width: 1rem;
  height: 1rem;
  border-radius: 26%;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 64%;
  box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.3);
}
.stage-swatch--photo {
  background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><circle cx='17' cy='6.8' r='2.4' fill='rgb(255,255,255)' fill-opacity='0.96'/><path d='M2.7 19a.9.9 0 0 1-.7-1.47l5.2-6.4a1.35 1.35 0 0 1 2.1 0l3 3.7 1.75-2.15a1.35 1.35 0 0 1 2.1 0l4.35 5.35A.9.9 0 0 1 19.8 19Z' fill='rgb(255,255,255)' fill-opacity='0.96'/></svg>");
  background-color: #e2606c;
}
.stage-swatch--video {
  background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M2.6 8.9A2.9 2.9 0 0 1 5.5 6h7a2.9 2.9 0 0 1 2.9 2.9v6.2a2.9 2.9 0 0 1-2.9 2.9h-7a2.9 2.9 0 0 1-2.9-2.9Z' fill='rgb(255,255,255)' fill-opacity='0.96'/><path d='M16.9 10.9l3.3-2.36a1 1 0 0 1 1.58.82v5.28a1 1 0 0 1-1.58.82l-3.3-2.36Z' fill='rgb(255,255,255)' fill-opacity='0.96'/></svg>");
  background-color: #3c4290;
}
.stage-swatch--app {
  background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M9.1 16.4a2.7 2.7 0 1 1-1.8-2.55V6.6c0-.52.37-.97.88-1.08l7.1-1.6a1.1 1.1 0 0 1 1.34 1.07v8.91a2.7 2.7 0 1 1-1.8-2.55V6.9L9.1 8.3Z' fill='rgb(255,255,255)' fill-opacity='0.97'/></svg>");
  background-color: #f8274b;
}
.stage-scene--battery {
  flex-direction: column;
  gap: 1.4rem;
  height: min(54vh, 30rem);
  perspective: 1100px;
}
.stage-batt-glow {
  position: absolute;
  top: 42%;
  left: 50%;
  width: min(30rem, 90vw);
  height: min(22rem, 66vw);
  border-radius: 50%;
  background: radial-gradient( closest-side, var(--primary) 0%, transparent 70% );
  @supports (color: color-mix(in lab, red, red)) {
    background: radial-gradient( closest-side, color-mix(in oklab, var(--primary) calc(46% - var(--stage-fill) * 34%), rgb(255 214 150 / 0.55)) 0%, transparent 70% );
  }
  opacity: calc((0.12 + var(--batt-new) * 0.5) * var(--batt-vis));
  transform: translate(-50%, -50%) scale(calc(0.6 + var(--batt-new) * 0.5));
  mix-blend-mode: plus-lighter;
  pointer-events: none;
}
.stage-batt {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  opacity: var(--batt-vis);
  transform: translateY(calc(var(--batt-shift) * -45%)) rotate(calc((1 - var(--stage-fill)) * -29deg));
  filter: drop-shadow(0 26px 48px rgb(0 0 0 / 0.55));
}
.stage-batt-dead {
  position: absolute;
  inset: 0 0 auto 0;
  z-index: 1;
  height: calc((1 - var(--stage-fill)) * 100%);
  border-bottom: 1px dashed rgb(255 105 97 / 0.7);
  background: repeating-linear-gradient( 135deg, rgb(255 255 255 / 0.1) 0 4px, transparent 4px 10px );
}
.stage-batt-terminal {
  width: 2.6rem;
  height: 0.55rem;
  border: 1px solid rgb(255 255 255 / 0.28);
  border-bottom: 0;
  border-radius: 0.3rem 0.3rem 0 0;
  background: repeating-linear-gradient( 90deg, rgb(255 255 255 / 0.3) 0 3px, transparent 3px 7px );
}
.stage-batt-shell {
  position: relative;
  overflow: hidden;
  width: min(11.5rem, 40vw);
  aspect-ratio: 10 / 15;
  border: 1.5px solid rgb(255 255 255 / 0.3);
  border-radius: 1.3rem;
  background: linear-gradient(160deg, #1d1d22 0%, #101014 55%, #17171c 100%);
  box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.12), inset 0 -14px 30px rgb(0 0 0 / 0.4);
}
.stage-batt-liquid {
  position: absolute;
  inset: auto 0 0 0;
  height: calc(var(--stage-fill) * 100%);
  background: linear-gradient( 180deg, var(--inverse-foreground) 0%, var(--inverse-foreground) 100% );
  @supports (color: color-mix(in lab, red, red)) {
    background: linear-gradient( 180deg, color-mix( in oklab, var(--inverse-foreground) clamp(0%, (var(--stage-fill) - 0.8) * 700%, 100%), var(--primary) ) 0%, color-mix( in oklab, var(--inverse-foreground) clamp(0%, (var(--stage-fill) - 0.82) * 700%, 100%), var(--primary) ) 100% );
  }
}
.stage-batt-surface {
  position: absolute;
  top: -1px;
  left: 0;
  width: 100%;
  height: 0.8rem;
  background: radial-gradient(50% 100% at 50% 0%, rgb(255 255 255 / 0.55), transparent 72%);
}
.stage-batt-sheen {
  position: absolute;
  inset: 0;
  background: linear-gradient( 100deg, transparent 8%, rgb(255 255 255 / 0.14) 16%, transparent 30% );
  pointer-events: none;
}
.stage-batt-face {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  color: #101318;
  @supports (color: color-mix(in lab, red, red)) {
    color: color-mix( in oklab, #101318 clamp(0%, (var(--stage-fill) - 0.86) * 1000%, 100%), #fff );
  }
}
.stage-batt-percent {
  display: flex;
  align-items: baseline;
  font-family: var(--font-display);
  font-weight: 600;
  letter-spacing: -0.04em;
  line-height: 1;
}
.stage-batt-percent b {
  font-weight: 600;
  font-size: clamp(2.6rem, 8vw, 4rem);
}
.stage-batt-percent i {
  font-style: normal;
  font-size: clamp(1.1rem, 3vw, 1.5rem);
  margin-left: 0.15rem;
}
.stage-batt-meta {
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 0.24em;
  text-indent: 0.24em;
  opacity: 0.78;
}
.stage-status {
  font-size: 0.9375rem;
  letter-spacing: 0.04em;
  color: var(--inverse-muted-foreground);
}
.stage-scene--board {
  height: min(56vh, 30rem);
}
.stage-board-glow {
  position: absolute;
  width: min(50rem, 96vw);
  height: 80%;
  border-radius: 50%;
  background: radial-gradient( closest-side, var(--primary) 0%, transparent 72% );
  @supports (color: color-mix(in lab, red, red)) {
    background: radial-gradient( closest-side, color-mix( in oklab, var(--primary) calc(42% - var(--rp-live) * 36%), rgb(255 216 164 / 0.6) ) 0%, transparent 72% );
  }
  opacity: calc(0.14 + var(--stage-p) * 0.12 + var(--rp-live) * 0.4);
  filter: blur(4px);
}
.stage-board {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.15rem;
  width: min(44rem, 92vw, 74vh);
  perspective: 1400px;
}
.stage-board-pcb {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 10;
  border: 1px solid rgb(198 240 216 / 0.12);
  border-radius: 1rem;
  background: radial-gradient(120% 90% at 50% -12%, rgb(255 255 255 / 0.05), transparent 58%), linear-gradient(155deg, #18221e 0%, #0d1412 55%, #121b18 100%);
  box-shadow: 0 30px 70px rgb(0 0 0 / 0.55), inset 0 1px 0 rgb(255 255 255 / 0.06);
  transform: rotateX(calc(15deg - var(--stage-p) * 6deg)) translateY(calc((1 - var(--stage-lift)) * 2rem)) scale(calc(0.97 + var(--stage-lift) * 0.03));
}
.stage-board-net {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.stage-board-net path {
  fill: none;
  stroke-width: 2.4;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.stage-board-trace path {
  stroke: rgb(198 138 82 / 0.4);
}
.stage-board-flow path {
  stroke: #ffd2a0;
  stroke-dasharray: 9 27;
  opacity: var(--rp-live);
  filter: drop-shadow(0 0 5px rgb(255 190 130 / 0.75));
  animation: stage-board-flow 1.6s linear infinite;
}
@keyframes stage-board-flow {
  to {
    stroke-dashoffset: -36;
  }
}
.stage-part {
  position: absolute;
  border-radius: 0.2rem;
  background: linear-gradient(160deg, #2c3034 0%, #15181a 70%);
  box-shadow: 0 4px 10px rgb(0 0 0 / 0.5), inset 0 1px 0 rgb(255 255 255 / 0.1);
}
.stage-part--soc::before, .stage-part--soc::after, .stage-part--nand::before, .stage-part--nand::after, .stage-part--pmic::before, .stage-part--pmic::after, .stage-swap-new::before, .stage-swap-new::after, .stage-swap-old::before, .stage-swap-old::after {
  content: "";
  position: absolute;
  inset-inline: 8%;
  height: 3px;
  background: repeating-linear-gradient(90deg, rgb(206 162 112 / 0.55) 0 2px, transparent 2px 7px);
}
.stage-part--soc::before, .stage-part--nand::before, .stage-part--pmic::before, .stage-swap-new::before, .stage-swap-old::before {
  top: -3px;
}
.stage-part--soc::after, .stage-part--nand::after, .stage-part--pmic::after, .stage-swap-new::after, .stage-swap-old::after {
  bottom: -3px;
}
.stage-part--soc {
  top: 30%;
  left: 9%;
  width: 24%;
  height: 38%;
  border-radius: 0.35rem;
  background: linear-gradient(155deg, #35393f 0%, #1b1e22 60%, #23262b 100%);
}
.stage-part--soc b {
  position: absolute;
  inset: 20%;
  border-radius: 0.2rem;
  background: radial-gradient( closest-side, rgb(255 228 188 / 0.75), rgb(255 150 90 / 0.24) 66%, transparent );
  opacity: var(--rp-live);
  box-shadow: 0 0 20px rgb(255 190 130 / calc(var(--rp-live) * 0.7));
}
.stage-part--nand {
  top: 14%;
  left: 58%;
  width: 20%;
  height: 21%;
}
.stage-part--pmic {
  top: 20%;
  left: 82%;
  width: 12%;
  height: 16%;
}
.stage-part--fpc {
  top: 52%;
  left: 87%;
  width: 8%;
  height: 32%;
  border-radius: 0.2rem;
  background: linear-gradient(160deg, #33373d 0%, #191c1f 75%);
}
.stage-part--fpc::after {
  content: "";
  position: absolute;
  inset: 22% 24%;
  border-radius: 0.1rem;
  background: #0b0d0f;
  box-shadow: inset 0 1px 2px rgb(0 0 0 / 0.8);
}
.stage-part--cap {
  top: var(--y);
  left: var(--x);
  width: 3.6%;
  height: 6.4%;
  border-radius: 0.1rem;
  background: linear-gradient(90deg, #6f757d 0%, #3a3e44 55%, #565b62 100%);
}
.stage-part--coil {
  top: var(--y);
  left: var(--x);
  width: 8%;
  height: 12%;
  border-radius: 0.25rem;
  background: linear-gradient(150deg, #3a3f44 0%, #1d2023 70%);
}
.stage-swap {
  position: absolute;
  top: 52%;
  left: 41%;
  width: 18%;
  height: 24%;
}
.stage-swap-fault {
  position: absolute;
  inset: -70%;
  border-radius: 999px;
  background: radial-gradient(closest-side, rgb(226 60 74 / 0.6), transparent 70%);
  opacity: var(--rp-fault);
  animation: stage-board-throb 1.4s ease-in-out infinite;
  pointer-events: none;
}
@keyframes stage-board-throb {
  0%, 100% {
    transform: scale(0.82);
    filter: brightness(0.7);
  }
  50% {
    transform: scale(1.06);
    filter: brightness(1.45);
  }
}
.stage-swap-pad {
  position: absolute;
  inset: 0;
  border: 1px dashed rgb(214 164 108 / 0.35);
  border-radius: 0.2rem;
  opacity: clamp(0, calc(0.2 + var(--rp-out) * 0.8 - var(--rp-in) * 0.85), 1);
}
.stage-swap-pad::before, .stage-swap-pad::after {
  content: "";
  position: absolute;
  inset-inline: 6%;
  height: 3px;
  background: repeating-linear-gradient(90deg, rgb(228 176 116 / 0.95) 0 3px, transparent 3px 8px);
}
.stage-swap-pad::before {
  top: -3px;
}
.stage-swap-pad::after {
  bottom: -3px;
}
.stage-swap-old {
  position: absolute;
  inset: 0;
  border-radius: 0.2rem;
  background: linear-gradient(155deg, #2c2225 0%, #171214 65%);
  box-shadow: 0 4px 10px rgb(0 0 0 / 0.5), inset 0 0 12px rgb(226 60 74 / 0.4);
  opacity: calc(1 - clamp(0, calc((var(--rp-out) - 0.3) / 0.55), 1));
  transform: translateY(calc(var(--rp-out) * -7rem)) rotate(calc(var(--rp-out) * -9deg)) scale(calc(1 + var(--rp-out) * 0.14));
}
.stage-swap-new {
  position: absolute;
  inset: 0;
  border-radius: 0.2rem;
  background: linear-gradient(155deg, #3b4046 0%, #1c1f23 65%, #272b30 100%);
  box-shadow: 0 6px 14px rgb(0 0 0 / 0.55), inset 0 1px 0 rgb(255 255 255 / 0.16);
  opacity: clamp(0, calc(var(--rp-in) * 4), 1);
  transform: translateY(calc((1 - var(--rp-in)) * -6.5rem)) scale(calc(1.1 - var(--rp-in) * 0.1));
}
.stage-swap-flash {
  position: absolute;
  inset: -20% -8%;
  border-radius: 0.4rem;
  background: radial-gradient(58% 40% at 50% 5%, rgb(255 226 176 / 0.95), transparent 72%), radial-gradient(58% 40% at 50% 95%, rgb(255 226 176 / 0.95), transparent 72%);
  opacity: var(--rp-solder);
  mix-blend-mode: plus-lighter;
  pointer-events: none;
}
.stage-board-scan {
  position: absolute;
  top: 4%;
  bottom: 4%;
  left: calc(var(--rp-scan) * 100%);
  width: 2px;
  background: linear-gradient(180deg, transparent, rgb(255 255 255 / 0.85), transparent);
  opacity: var(--rp-scan-opacity);
  box-shadow: 0 0 26px 5px rgb(255 255 255 / 0.3);
  pointer-events: none;
}
.stage-board-readout {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0.4rem 0.95rem;
  border: 1px solid var(--inverse-border);
  border-radius: 999px;
  background: var(--inverse-foreground);
  @supports (color: color-mix(in lab, red, red)) {
    background: color-mix(in oklab, var(--inverse-foreground) 5%, transparent);
  }
  font-size: 0.75rem;
  letter-spacing: 0.14em;
  color: var(--inverse-muted-foreground);
}
.stage-board-readout b {
  font-weight: 600;
  color: var(--inverse-foreground);
}
.stage-board-readout b i {
  font-style: normal;
}
.stage-board-led {
  width: 0.45rem;
  height: 0.45rem;
  border-radius: 999px;
  background: #7bd8a4;
  @supports (color: color-mix(in lab, red, red)) {
    background: color-mix(in oklab, #7bd8a4 calc(var(--rp-live) * 100%), var(--primary));
  }
  box-shadow: 0 0 10px 2px #7bd8a4;
  @supports (color: color-mix(in lab, red, red)) {
    box-shadow: 0 0 10px 2px color-mix(in oklab, #7bd8a4 calc(var(--rp-live) * 100%), var(--primary));
  }
  animation: stage-board-blink 1.6s ease-in-out infinite;
}
@keyframes stage-board-blink {
  0%, 100% {
    opacity: 0.5;
  }
  50% {
    opacity: 1;
  }
}
.stage-handset {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  width: 100%;
}
.stage-handset-shell {
  position: relative;
}
.stage-handset-bezel {
  position: relative;
  overflow: hidden;
  width: min(16.5rem, 58vw);
  aspect-ratio: 9 / 19.2;
  border: 1px solid var(--inverse-border);
  border-radius: 2rem;
  background: #050506;
  box-shadow: 0 24px 60px rgb(0 0 0 / 0.45);
}
.stage-handset-screen {
  position: absolute;
  inset: 0.55rem;
  overflow: hidden;
  border-radius: 1.35rem;
  background: rgb(0 0 0 / 0.92);
}
.stage-handset--ipad .stage-handset-screen {
  inset: 0.7rem;
  border-radius: 0.7rem;
}
.stage-island {
  position: absolute;
  top: 4.5%;
  left: 50%;
  width: 30%;
  height: 3.4%;
  border: 1px solid rgb(255 255 255 / 0.1);
  border-radius: 999px;
  background: #000;
  transform: translateX(-50%);
}
.stage-glass {
  position: absolute;
  inset: 0;
  background: linear-gradient( 118deg, transparent 30%, rgb(255 255 255 / 0.05) 44%, rgb(255 255 255 / 0.02) 52%, transparent 62% );
  pointer-events: none;
}
.stage-privacy-screen {
  background: #121214;
}
.stage-blobs {
  position: absolute;
  inset: 0;
}
.stage-blobs span {
  position: absolute;
  border-radius: 999px;
  filter: blur(28px);
  opacity: 0.7;
}
.stage-blobs span:nth-child(1) {
  top: 18%;
  left: 12%;
  width: 42%;
  height: 28%;
  background: #8a7a68;
  transform: translate3d(calc(var(--stage-p) * 14%), calc(var(--stage-p) * -12%), 0) scale(calc(1 + var(--stage-p) * 0.22));
}
.stage-blobs span:nth-child(2) {
  top: 42%;
  right: 8%;
  width: 38%;
  height: 24%;
  background: #4a5560;
  transform: translate3d(calc(var(--stage-p) * -16%), calc(var(--stage-p) * 10%), 0) scale(calc(1 + var(--stage-p) * 0.16));
}
.stage-blobs span:nth-child(3) {
  bottom: 16%;
  left: 22%;
  width: 48%;
  height: 22%;
  background: #6b5344;
  transform: translate3d(calc(var(--stage-p) * 10%), calc(var(--stage-p) * 14%), 0) scale(calc(1 + var(--stage-p) * 0.18));
}
.stage-frost {
  position: absolute;
  inset: 0;
  background: var(--inverse);
  @supports (color: color-mix(in lab, red, red)) {
    background: color-mix(in oklab, var(--inverse) 52%, transparent);
  }
  backdrop-filter: blur(16px) saturate(140%);
  -webkit-backdrop-filter: blur(16px) saturate(140%);
  clip-path: circle(calc(var(--stage-frost) * 78%) at 50% 50%);
}
.stage-shield {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 7.25rem;
  height: 7.25rem;
  transform: translate(-50%, -50%) rotate(-90deg);
  opacity: clamp(0, calc(var(--stage-lock) * 2), 1);
  pointer-events: none;
}
.stage-shield circle {
  fill: none;
  stroke-width: 1.5;
}
.stage-shield-track {
  stroke: rgb(255 255 255 / 0.12);
}
.stage-shield-draw {
  stroke: rgb(255 255 255 / 0.85);
  stroke-linecap: round;
  stroke-dasharray: 1;
  stroke-dashoffset: calc(1 - var(--stage-lock));
  filter: drop-shadow(0 0 6px rgb(255 255 255 / 0.35));
}
.stage-lock {
  position: absolute;
  top: 50%;
  left: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  opacity: var(--stage-lock);
  transform: translate(-50%, -50%) scale(calc(0.4 + var(--stage-lock) * 0.6));
  filter: blur(calc((1 - var(--stage-lock)) * 12px)) drop-shadow(0 10px 24px rgb(0 0 0 / 0.5));
}
.stage-lock-shackle {
  width: 1.7rem;
  height: 1.3rem;
  border: 4px solid var(--inverse-foreground);
  border-bottom: 0;
  border-radius: 0.95rem 0.95rem 0 0;
  transform: translateY(calc((1 - clamp(0, (var(--stage-lock) - 0.72) * 3.6, 1)) * -0.5rem));
}
.stage-lock-body {
  position: relative;
  width: 2.7rem;
  height: 2.1rem;
  border-radius: 0.5rem;
  background: var(--inverse-foreground);
}
.stage-lock-body i {
  position: absolute;
  top: 30%;
  left: 50%;
  width: 0.42rem;
  height: 0.42rem;
  margin-left: -0.21rem;
  border-radius: 999px;
  background: #121214;
}
.stage-lock-body i::after {
  content: "";
  position: absolute;
  top: 82%;
  left: 50%;
  width: 2px;
  height: 0.42rem;
  margin-left: -1px;
  background: #121214;
}
.stage-passcode {
  position: absolute;
  bottom: 12%;
  left: 50%;
  display: flex;
  gap: 0.55rem;
  transform: translateX(-50%);
  opacity: clamp(0, calc(var(--stage-frost) * 3), 1);
}
.stage-passcode i {
  position: relative;
  width: 0.5rem;
  height: 0.5rem;
  border: 1px solid rgb(255 255 255 / 0.4);
  border-radius: 999px;
}
.stage-passcode i::after {
  content: "";
  position: absolute;
  inset: 1px;
  border-radius: inherit;
  background: #fff;
  opacity: clamp(0, calc((var(--stage-frost) - 0.25 - var(--dot-i) * 0.12) * 8), 1);
}
.stage--static .stage-beats {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
  min-height: 0;
}
.stage--static .stage-beat {
  position: static;
  opacity: 1;
  filter: none;
  transform: none;
}
.stage--static .stage-swap-fault {
  display: none;
}
.stage--static .stage-board-flow path, .stage--static .stage-board-led {
  animation: none;
}
@media (prefers-reduced-motion: reduce) {
  .stage-beat, .stage-mem-phone, .stage-mem-meter i {
    transition: none;
    animation: none;
  }
  .stage-board-flow path, .stage-board-led {
    animation: none;
  }
  .stage-swap-fault {
    display: none;
  }
}
@property --tw-space-y-reverse {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-border-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}
@property --tw-leading {
  syntax: "*";
  inherits: false;
}
@property --tw-font-weight {
  syntax: "*";
  inherits: false;
}
@property --tw-tracking {
  syntax: "*";
  inherits: false;
}
@property --tw-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-duration {
  syntax: "*";
  inherits: false;
}
@property --tw-ease {
  syntax: "*";
  inherits: false;
}
@property --tw-translate-x {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-translate-y {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-translate-z {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@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-space-y-reverse: 0;
      --tw-border-style: solid;
      --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-duration: initial;
      --tw-ease: initial;
      --tw-translate-x: 0;
      --tw-translate-y: 0;
      --tw-translate-z: 0;
    }
  }
}