html[data-lux="full"] {
  --lux-ease-out: cubic-bezier(.22,1,.36,1);
  --lux-ease-spring: cubic-bezier(.34,1.4,.64,1);
  --lux-dur-1: 160ms;
  --lux-dur-2: 280ms;
  --lux-dur-3: 480ms;
}

html[data-lux="full"] .lux-grain {
  position: fixed;
  inset: 0;
  z-index: 2147483000;
  pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E");
  background-size: 180px 180px;
  opacity: .05;
  mix-blend-mode: overlay;
}

html[data-lux="full"][data-theme="light"] .lux-grain {
  opacity: .03;
  mix-blend-mode: soft-light;
}

html[data-lux="full"] [data-lux-reveal] {
  opacity: 0;
  transform: translateY(14px);
  filter: blur(6px);
}

html[data-lux="full"] [data-lux-reveal].is-revealed {
  opacity: 1;
  transform: none;
  filter: none;
  transition:
    opacity .48s var(--lux-ease-out),
    transform .48s var(--lux-ease-out),
    filter .48s var(--lux-ease-out);
  transition-delay: calc(var(--lux-i, 0) * 70ms);
}

html[data-lux="full"] .lux-skel {
  display: block;
  border-radius: 10px;
  background: linear-gradient(100deg, var(--deep) 40%, rgba(77,217,192,.07) 50%, var(--deep) 60%);
  background-size: 200% 100%;
  animation: lux-skel-sweep 1.8s linear infinite;
}

html[data-lux="full"] .lux-orb {
  position: relative;
  display: inline-grid;
  place-items: center;
  width: calc(40px * var(--lux-orb-size, 1));
  height: calc(40px * var(--lux-orb-size, 1));
  flex: 0 0 auto;
  border-radius: 50%;
  background:
    radial-gradient(circle at 38% 34%, rgba(238,245,252,.92) 0 5%, rgba(77,217,192,.85) 14%, transparent 35%),
    radial-gradient(circle at 50% 55%, rgba(77,217,192,.72) 0 24%, rgba(77,217,192,.18) 46%, transparent 70%);
  box-shadow: 0 0 12px rgba(77,217,192,.32), 0 0 30px rgba(77,217,192,.14);
  animation: lux-orb-breathe 2.6s ease-in-out infinite alternate;
  isolation: isolate;
}

html[data-lux="full"] .lux-orb::before {
  content: '';
  position: absolute;
  inset: 3px;
  z-index: -1;
  border-radius: inherit;
  background: conic-gradient(from 0deg, transparent 0 25%, rgba(77,217,192,.62) 38%, transparent 52% 78%, rgba(238,245,252,.25) 90%, transparent);
  animation: lux-orb-spin 3.2s linear infinite;
}

html[data-lux="full"] .lux-orb::after {
  content: '';
  width: 38%;
  height: 38%;
  border-radius: inherit;
  background: radial-gradient(circle, rgba(238,245,252,.88) 0 9%, rgba(77,217,192,.9) 32%, transparent 72%);
  box-shadow: 0 0 12px rgba(77,217,192,.55);
}

html[data-lux="full"] .boot-banner .lux-orb {
  --lux-orb-size: .55;
  margin-right: 10px;
  vertical-align: middle;
}

html[data-lux="full"] .lux-orb.is-paused,
html[data-lux="full"] .lux-orb.is-paused::before {
  animation-play-state: paused;
}

html[data-lux="full"] .lux-hoverable {
  transition:
    transform var(--lux-dur-2) var(--lux-ease-out),
    box-shadow var(--lux-dur-2) var(--lux-ease-out),
    border-color var(--lux-dur-2) var(--lux-ease-out);
}

html[data-lux="full"] .lux-hoverable:hover {
  transform: translateY(-3px);
  border: 1px solid rgba(77,217,192,.35);
  box-shadow: 0 18px 44px rgba(6,17,29,.5), 0 0 0 1px rgba(77,217,192,.12);
}

html[data-lux="full"][data-theme="light"] .lux-hoverable:hover {
  border-color: rgba(77,217,192,.35);
  box-shadow: 0 12px 30px rgba(6,17,29,.16), 0 0 0 1px rgba(77,217,192,.12);
}

html[data-lux="full"] .lux-btn-roll {
  display: inline-flex;
  align-items: center;
  overflow: hidden;
}

html[data-lux="full"] .lux-btn-roll > span.lux-btn-roll__stack {
  position: relative;
  display: inline-block;
  line-height: 1.15;
  transition: transform .28s var(--lux-ease-out);
}

html[data-lux="full"] .lux-btn-roll > span.lux-btn-roll__stack > span {
  display: block;
  white-space: nowrap;
}

html[data-lux="full"] .lux-btn-roll > span.lux-btn-roll__stack > span:last-child {
  position: absolute;
  top: 100%;
  inset-inline-start: 0;
}

html[data-lux="full"] .lux-btn-roll:hover > span.lux-btn-roll__stack,
html[data-lux="full"] .lux-btn-roll:focus-visible > span.lux-btn-roll__stack {
  transform: translateY(-100%);
}

html[data-lux="full"] .lux-num {
  font-variant-numeric: tabular-nums;
}

html[data-lux="full"] .lux-pop {
  transform-origin: center;
  animation: lux-pop-enter var(--lux-dur-1) var(--lux-ease-spring) both;
}

html[data-lux="full"] [data-lux-magnetic] {
  transition: translate var(--lux-dur-2) var(--lux-ease-spring);
}

html[data-lux="full"] .lux-check {
  display: block;
  width: 52px;
  height: 52px;
  overflow: visible;
}

html[data-lux="full"] .lux-check circle,
html[data-lux="full"] .lux-check path {
  fill: none;
  stroke: var(--aqua);
  stroke-linecap: round;
  stroke-linejoin: round;
}

html[data-lux="full"] .lux-check circle {
  stroke-dasharray: 166;
  stroke-dashoffset: 166;
}

html[data-lux="full"] .lux-check path {
  stroke-dasharray: 48;
  stroke-dashoffset: 48;
}

html[data-lux="full"] .lux-check.is-drawn circle,
html[data-lux="full"] .lux-check.is-drawn path {
  stroke-dashoffset: 0;
  transition: stroke-dashoffset .55s var(--lux-ease-out);
}

html[data-lux="full"] .lux-check.is-drawn path {
  transition-delay: 120ms;
}

@keyframes lux-skel-sweep {
  from { background-position: 100% 0; }
  to { background-position: -100% 0; }
}

@keyframes lux-orb-spin {
  to { transform: rotate(1turn); }
}

@keyframes lux-orb-breathe {
  from {
    transform: scale(.94);
    box-shadow: 0 0 10px rgba(77,217,192,.24), 0 0 24px rgba(77,217,192,.1);
  }
  to {
    transform: scale(1.04);
    box-shadow: 0 0 17px rgba(77,217,192,.44), 0 0 38px rgba(77,217,192,.2);
  }
}

@keyframes lux-pop-enter {
  from { opacity: 0; transform: scale(.96); }
  to { opacity: 1; transform: scale(1); }
}

@media (prefers-reduced-motion: reduce) {
  html[data-lux="full"] [data-lux-reveal] {
    opacity: 1;
    transform: none;
    filter: none;
  }

  html[data-lux="full"] [data-lux-reveal],
  html[data-lux="full"] .lux-skel,
  html[data-lux="full"] .lux-orb,
  html[data-lux="full"] .lux-orb::before,
  html[data-lux="full"] .lux-hoverable,
  html[data-lux="full"] .lux-btn-roll > span.lux-btn-roll__stack,
  html[data-lux="full"] .lux-pop,
  html[data-lux="full"] [data-lux-magnetic],
  html[data-lux="full"] .lux-check circle,
  html[data-lux="full"] .lux-check path {
    animation: none !important;
    transition: none !important;
  }
}