:root {
  --se-route-duration: 220ms;
  --se-route-exit-duration: 96ms;
  --se-modal-duration: 180ms;
  --se-motion-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --se-motion-exit: 120ms;
  --se-motion-ease-in: cubic-bezier(0.4, 0, 1, 1);
  --se-modal-blur: 8px;
}

html[data-se-motion-hz="60"] {
  --se-route-duration: 220ms;
  --se-modal-duration: 190ms;
  --se-modal-blur: 6px;
}

html[data-se-motion-hz="90"] {
  --se-route-duration: 210ms;
  --se-modal-duration: 175ms;
}

html[data-se-motion-hz="120"] {
  --se-route-duration: 200ms;
  --se-modal-duration: 165ms;
}

html[data-se-motion-hz="144"] {
  --se-route-duration: 190ms;
  --se-modal-duration: 155ms;
}

@view-transition {
  navigation: auto;
}

::view-transition-group(root) {
  animation-duration: var(--se-route-duration);
  animation-timing-function: var(--se-motion-ease);
}

::view-transition-image-pair(root) {
  isolation: isolate;
}

::view-transition-old(root) {
  animation: sellerengineRouteOut var(--se-route-duration) var(--se-motion-ease) both;
  mix-blend-mode: normal;
}

::view-transition-new(root) {
  animation: sellerengineRouteIn var(--se-route-duration) var(--se-motion-ease) both;
  mix-blend-mode: normal;
}

@keyframes sellerengineRouteOut {
  from { opacity: 1; transform: translate3d(0, 0, 0); }
  to { opacity: 0.78; transform: translate3d(-32px, 0, 0); }
}

@keyframes sellerengineRouteIn {
  from { opacity: 0.68; transform: translate3d(48px, 0, 0); }
  to { opacity: 1; transform: translate3d(0, 0, 0); }
}

.sellerengine-route-cover {
  position: fixed !important;
  inset: 0 !important;
  z-index: 2147482998 !important;
  pointer-events: none !important;
  opacity: 0 !important;
  transform: translateZ(0) !important;
  background: rgba(2, 3, 4, 0.16) !important;
  transition: opacity var(--se-route-exit-duration) linear !important;
  will-change: auto !important;
}

html[data-se-theme="light"] .sellerengine-route-cover {
  background: rgba(232, 239, 248, 0.22) !important;
}

html.sellerengine-route-leaving,
html.sellerengine-route-leaving > body {
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
}

html.sellerengine-route-leaving #app {
  opacity: 0.86 !important;
  transform: translate3d(-10px, 0, 0) !important;
  transition:
    opacity var(--se-route-exit-duration) ease-out,
    transform var(--se-route-exit-duration) ease-out !important;
}

html.sellerengine-route-leaving .sellerengine-route-cover,
html.sellerengine-route-leaving .sellerengine-route-cover.is-leaving {
  opacity: 1 !important;
  pointer-events: auto !important;
}

html.sellerengine-route-entered > body {
  animation: none !important;
}

html.sellerengine-route-entered [data-se-route-content] {
  animation: sellerengineFallbackRouteIn var(--se-route-duration) var(--se-motion-ease) both !important;
}

@keyframes sellerengineFallbackRouteIn {
  from { opacity: 0.92; transform: translate3d(32px, 0, 0); }
  to { opacity: 1; transform: translate3d(0, 0, 0); }
}

:is(
  .g-confirm-overlay.visible,
  .confirm-backdrop.show,
  .modal-backdrop.show,
  .taxledger-app .modal-backdrop:not(.hidden),
  .lh-flow-modal:not([hidden]),
  .lh-confirm-modal,
  .billing-paywall:not([hidden]),
  #progressModal:not(.hidden),
  #confirmToastBackdrop.visible,
  .settings-confirm-overlay,
  .sellerengine-saas-shell.is-visible
) {
  animation: sellerengineBackdropIn var(--se-modal-duration) ease-out backwards !important;
  transition: opacity var(--se-modal-duration) ease-out !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

:is(
  .g-confirm-overlay.visible,
  .confirm-backdrop.show,
  .modal-backdrop.show,
  .taxledger-app .modal-backdrop:not(.hidden),
  .lh-flow-modal:not([hidden]),
  .lh-confirm-modal,
  .billing-paywall:not([hidden]),
  #progressModal:not(.hidden),
  #confirmToastBackdrop.visible,
  .settings-confirm-overlay,
  .sellerengine-saas-shell.is-visible
) :is(
  .g-confirm-card,
  .confirm-dialog,
  .modal,
  .lh-flow-dialog,
  .lh-confirm-dialog,
  .billing-paywall-card,
  .sellerengine-saas-card,
  .confirm-toast-card,
  .settings-confirm-dialog,
  .glass-card,
  [role="dialog"]
) {
  animation: sellerengineDialogIn var(--se-modal-duration) var(--se-motion-ease) backwards !important;
  will-change: transform, opacity;
}

@media (prefers-reduced-motion: no-preference) {
  html:root :is(
    .g-confirm-overlay:not(.visible),
    .confirm-backdrop:not(.show),
    body:not(.taxledger-app) .modal-backdrop:not(.show),
    .taxledger-app .modal-backdrop.hidden,
    .lh-flow-modal[hidden],
    .lh-confirm-modal.is-closing,
    .billing-paywall[hidden],
    #progressModal.hidden,
    #confirmToastBackdrop:not(.visible),
    .settings-confirm-overlay.is-closing,
    .sellerengine-saas-shell:not(.is-visible)
  ) {
    opacity: 0 !important;
    pointer-events: none !important;
    animation: none !important;
    transition:
      opacity var(--se-motion-exit) var(--se-motion-ease-in),
      display var(--se-motion-exit) allow-discrete !important;
  }

  html:root :is(
    .g-confirm-overlay:not(.visible),
    .confirm-backdrop:not(.show),
    body:not(.taxledger-app) .modal-backdrop:not(.show),
    .taxledger-app .modal-backdrop.hidden,
    .lh-flow-modal[hidden],
    .lh-confirm-modal.is-closing,
    .billing-paywall[hidden],
    #progressModal.hidden,
    #confirmToastBackdrop:not(.visible),
    .settings-confirm-overlay.is-closing,
    .sellerengine-saas-shell:not(.is-visible)
  ) > :is(.g-confirm-card, .confirm-dialog, .modal, .lh-flow-dialog, .lh-confirm-dialog, .billing-paywall-card, .sellerengine-saas-card, .confirm-toast-card, .settings-confirm-dialog, .glass-card, [role="dialog"]) {
    opacity: 0 !important;
    transform: scale(0.98) !important;
    animation: none !important;
    transition:
      opacity var(--se-motion-exit) var(--se-motion-ease-in),
      transform var(--se-motion-exit) var(--se-motion-ease-in) !important;
  }
}

body .toast.toast.visible,
body .toast.toast.is-visible {
  will-change: transform, opacity;
}

body.sellerengine-canonical-app .sellerengine-demo-notice {
  transition: opacity var(--se-modal-duration) var(--se-motion-ease) !important;
}

body.sellerengine-canonical-app .sellerengine-demo-notice::before,
.standalone-demo-toast::before {
  transition: opacity var(--se-modal-duration) var(--se-motion-ease) !important;
}

body.sellerengine-canonical-app .sellerengine-demo-notice.is-visible::before,
.standalone-demo-toast.is-visible::before {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

body.sellerengine-canonical-app .sellerengine-demo-notice-shell {
  transition:
    opacity var(--se-modal-duration) var(--se-motion-ease),
    transform var(--se-modal-duration) var(--se-motion-ease) !important;
}

.sellerengine-saas-shell {
  transition: opacity var(--se-modal-duration) var(--se-motion-ease) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.sellerengine-saas-card,
.sellerengine-sync-banner,
.lh-kw-progress,
.sync-toast,
.notification-toast {
  transition:
    opacity var(--se-modal-duration) var(--se-motion-ease),
    transform var(--se-modal-duration) var(--se-motion-ease) !important;
}

@keyframes sellerengineBackdropIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes sellerengineDialogIn {
  from { opacity: 0; transform: translate3d(16px, 0, 0) scale(0.992); }
  to { opacity: 1; transform: translate3d(0, 0, 0) scale(1); }
}

@media screen {
  html:has(> body:is(.se-public-shell, [data-auth-page="app"]))::before,
  html:has(> body:is(.se-public-shell, [data-auth-page="app"]))::after,
  html:root body:is(.se-public-shell, [data-auth-page="app"], .sellerengine-canonical-app)::before,
  html:root body:is(.se-public-shell, [data-auth-page="app"], .sellerengine-canonical-app)::after,
  html:root body.sellerengine-canonical-app .ambient-bg {
    content: none !important;
    display: none !important;
  }

  html:root body:is(.se-public-shell, [data-auth-page="app"]) {
    background-attachment: scroll !important;
  }

  html:root body.se-public-shell:not(.landing-page) {
    background:
      radial-gradient(120% 62% at 50% -8%, rgba(66, 133, 244, 0.12), transparent 60%),
      radial-gradient(90% 55% at 88% 6%, rgba(155, 114, 203, 0.08), transparent 62%),
      linear-gradient(180deg, #090b11 0%, #07080c 46%, #060709 100%);
  }

  html:root body.sellerengine-canonical-app.sellerengine-user-app,
  html:root body.sellerengine-canonical-app.sellerengine-demo-app,
  html:root[data-se-theme="light"] body.sellerengine-canonical-app {
    background: var(--se-ui-page, #101314) !important;
  }

  html:root body[data-auth-page="app"] {
    background:
      radial-gradient(100% 100vh at 50% -12vh, rgba(66, 133, 244, 0.18), transparent 38%),
      radial-gradient(100% 100vh at 80% 84vh, rgba(217, 101, 112, 0.10), transparent 42%),
      #020304 !important;
  }

  html:root[data-se-theme="light"] body[data-auth-page="app"] {
    background: #e8eff8 !important;
  }

  html:root:is([data-theme="day"], [data-se-theme="light"]) body.se-public-shell {
    background: linear-gradient(180deg, #f8fafd, #ebeff6) !important;
  }

  html:root body.sellerengine-canonical-app .sellerengine-app-chrome,
  html:root body.sellerengine-canonical-app .sellerengine-app-chrome :is(.sellerengine-user-app-link, .sellerengine-demo-app-link),
  html:root body.sellerengine-canonical-app .sidebar-build-card {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  html:root body.sellerengine-canonical-app .sellerengine-app-chrome {
    transition: transform 220ms var(--se-motion-ease), opacity 180ms ease !important;
  }

  [data-se-reveal="in"] {
    will-change: auto;
  }
}

@media (prefers-reduced-motion: reduce) {
  html:root body.sellerengine-canonical-app .sellerengine-app-chrome {
    transition: none !important;
  }

  html:root {
    scroll-behavior: auto !important;
  }
  :is(.app-shell-sidebar, .app-shell-main, .glass-card) {
    transition: none !important;
  }

  ::view-transition-group(root),
  ::view-transition-old(root),
  ::view-transition-new(root),
  html.sellerengine-route-leaving #app,
  html.sellerengine-route-entered [data-se-route-content],
  :is(
    .g-confirm-overlay,
    .confirm-backdrop,
    .modal-backdrop,
    .lh-flow-modal,
    .lh-confirm-modal,
    .billing-paywall,
    #progressModal,
    #confirmToastBackdrop,
    .settings-confirm-overlay,
    .sellerengine-saas-shell,
    .sellerengine-saas-card,
    .sellerengine-sync-banner,
    .lh-kw-progress,
    .sync-toast,
    .notification-toast,
    .sellerengine-demo-notice,
    .sellerengine-demo-notice-shell,
    .standalone-demo-toast
  ) {
    animation: none !important;
    transition: none !important;
    transform: none !important;
  }

  html:root :is(.g-confirm-card, .confirm-dialog, .modal, .lh-flow-dialog, .lh-confirm-dialog, .billing-paywall-card, .sellerengine-saas-card, .confirm-toast-card, .settings-confirm-dialog, #progressModal .glass-card, .modal-backdrop [role="dialog"]) {
    animation: none !important;
    transition: none !important;
  }

  html:root :is(.lh-confirm-modal, .settings-confirm-overlay).is-closing {
    visibility: hidden !important;
  }
}