:root {
  --motion-duration-instant: 90ms;
  --motion-duration-fast: 140ms;
  --motion-duration-base: 220ms;
  --motion-duration-slow: 320ms;
  --motion-distance: 8px;
  --motion-scale-enter: .985;
  --motion-stagger: 24ms;
  --motion-stagger-limit: 8;
  --motion-ease-standard: cubic-bezier(.2, .8, .2, 1);
  --motion-ease-emphasized: cubic-bezier(.22, 1, .36, 1);
  --motion-ease-exit: cubic-bezier(.4, 0, 1, 1);
  --query-motion-duration: var(--motion-duration-base);
  --query-motion-ease: var(--motion-ease-standard);
  --query-motion-distance: var(--motion-distance);
  --query-layer-content: 1;
  --query-layer-sticky: 200;
  --query-layer-navigation: 400;
  --query-layer-dropdown: 2147483000;
  --query-layer-overlay: 2147483200;
  --query-layer-toast: 2147483400;
  --query-layer-watermark-top: 2147483600;
}

small {
  font-size: 16px;
}

html[data-query-motion-theme="ios"] {
  --motion-ease-standard: cubic-bezier(.22, 1, .36, 1);
  --motion-ease-emphasized: cubic-bezier(.18, 1.18, .32, 1);
}

html[data-query-motion-theme="macos"] {
  --motion-ease-standard: cubic-bezier(.2, .8, .2, 1);
  --motion-ease-emphasized: cubic-bezier(.16, 1, .3, 1);
}

html[data-query-motion-theme="android"] {
  --motion-ease-standard: cubic-bezier(.2, 0, 0, 1);
  --motion-ease-emphasized: cubic-bezier(.05, .7, .1, 1);
}

html[data-query-motion-ready="true"] body :where(
  button,
  [role="button"],
  .tab,
  .page-btn,
  .collapse-toggle,
  .pill,
  .tag,
  .chip,
  .bottom-nav a
) {
  transition-property: color, background-color, border-color, box-shadow, opacity, transform;
  transition-duration: var(--motion-duration-fast);
  transition-timing-function: var(--motion-ease-standard);
  touch-action: manipulation;
}

html[data-query-motion-ready="true"] body :where(
  button,
  [role="button"],
  .tab,
  .page-btn,
  .collapse-toggle,
  .bottom-nav a
):active {
  transform: scale(.98);
}

html[data-query-motion-ready="true"] body :where(.sheet-mask, .modal-mask, .dialog-mask, .drawer-mask) {
  z-index: var(--query-layer-overlay);
  transition: opacity var(--motion-duration-fast) var(--motion-ease-standard),
    visibility 0s linear var(--motion-duration-fast);
}

html[data-query-motion-ready="true"] body :where(.sheet-mask.show, .modal-mask.show, .dialog-mask.show, .drawer-mask.show) {
  transition-delay: 0s;
}

html[data-query-motion-ready="true"] body :where(.sheet, .modal, [role="dialog"]) {
  transition: opacity var(--motion-duration-base) var(--motion-ease-standard),
    transform var(--motion-duration-base) var(--motion-ease-emphasized);
}

html[data-query-motion-ready="true"] body :where(.drawer, .bottom-drawer) {
  transition: opacity var(--motion-duration-slow) var(--motion-ease-standard),
    transform var(--motion-duration-slow) var(--motion-ease-emphasized);
}

html[data-query-motion-ready="true"] body :where(.toast, [role="status"].toast) {
  z-index: var(--query-layer-toast);
  transition: opacity var(--motion-duration-fast) var(--motion-ease-standard),
    transform var(--motion-duration-fast) var(--motion-ease-emphasized);
}

html[data-query-motion-ready="true"] body :where(.collapsible-body, [data-collapsible-body]) {
  transition: opacity var(--motion-duration-base) var(--motion-ease-standard),
    transform var(--motion-duration-base) var(--motion-ease-emphasized);
}

html[data-query-motion-ready="true"] body :where(.tab-panel, [role="tabpanel"]):not([hidden]) {
  animation: query-tab-enter var(--motion-duration-base) var(--motion-ease-emphasized) both;
}

html[data-query-motion-ready="true"] body :where(.result-item, .smart-result, .candidate-card)[data-query-motion-enter="true"] {
  animation: query-result-enter var(--motion-duration-base) var(--motion-ease-emphasized) both;
  animation-delay: min(calc(var(--query-motion-index, 0) * var(--motion-stagger)), 180ms);
}

html[data-query-motion-dropdown="false"] .searchable-select-list,
html[data-query-motion-dialog="false"] body :where(.sheet-mask, .sheet, .modal-mask, .modal, .dialog-mask, [role="dialog"]),
html[data-query-motion-page="false"] body :where(.tab-panel, [role="tabpanel"]),
html[data-query-motion-result="false"] body :where(.result-item, .smart-result, .candidate-card),
html[data-query-motion-carousel="false"] body :where(.site-carousel-slide) {
  animation: none !important;
  transition-duration: .01ms !important;
}

.glass-action,
html[data-query-motion-ready="true"] body :where(.bottom-nav a, .ghost-btn, .collapse-toggle) {
  border: 1px solid rgba(125, 145, 170, .28);
  background-color: rgba(255, 255, 255, .78);
  box-shadow: 0 6px 18px rgba(22, 44, 70, .08);
}

html[data-motion-tier="full"] .glass-action,
html[data-motion-tier="full"] body :where(.bottom-nav a, .ghost-btn, .collapse-toggle) {
  -webkit-backdrop-filter: blur(10px) saturate(1.08);
  backdrop-filter: blur(10px) saturate(1.08);
}

html[data-query-motion-ready="true"] body .bottom-nav {
  -webkit-backdrop-filter: blur(10px) saturate(1.08) !important;
  backdrop-filter: blur(10px) saturate(1.08) !important;
}

html[data-query-motion-ready="true"] body:has(.searchable-select-list.open, .suggest-list.show) :where(
  .topbar,
  .hero-card,
  .filter-panel,
  .range-panel,
  .wish-panel,
  .smart-panel,
  .bottom-nav
) {
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html[data-motion-tier="low"] body :where(
  .topbar,
  .hero-card,
  .filter-panel,
  .range-panel,
  .wish-panel,
  .smart-panel,
  .sheet,
  .stat-card,
  .result-item,
  .glass-action
) {
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html[data-motion-tier="low"] body :where(.site-carousel-slide, .decorative-motion) {
  animation: none !important;
}

html.admin-motion-disabled *,
html.admin-motion-disabled *::before,
html.admin-motion-disabled *::after {
  animation-duration: .01ms !important;
  animation-iteration-count: 1 !important;
  scroll-behavior: auto !important;
  transition-duration: .01ms !important;
}

@keyframes query-result-enter {
  from { opacity: 0; transform: translate3d(0, var(--motion-distance), 0) scale(var(--motion-scale-enter)); }
  to { opacity: 1; transform: translate3d(0, 0, 0) scale(1); }
}

@keyframes query-tab-enter {
  from { opacity: 0; transform: translate3d(0, calc(var(--motion-distance) * .5), 0); }
  to { opacity: 1; transform: translate3d(0, 0, 0); }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
  }
}

@media (max-width: 760px) {
  html[data-motion-tier="full"] body :where(.topbar, .hero-card, .filter-panel, .range-panel, .wish-panel, .smart-panel, .sheet, .result-item) {
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }
}
