/* One class on the root, everything else via data-* (see README "Rules").
   Values come from the live site's button-sizes variable modes and
   tt-wf/scss/components/_buttons-new.scss.

   Hover is a number: --_hover is 0 or 1 and every hover effect is multiplied by it.
   The button sets it to 1 on its own hover; a parent can set --tt-btn-hover: 1
   (e.g. a hovered card) and the button reacts the same way, also as Visual only. */
.AisLsJaE_AWnIhDlnTUV {
  --_t: var(--transition-base, 0.25s cubic-bezier(0.65, 0, 0.35, 1));
  --_t-press: 0.08s cubic-bezier(0.3, 0, 0.7, 1);
  /* Arrow and text motion: same timing whether the button or a parent card is hovered. */
  --_t-motion: 0.4s cubic-bezier(0.65, 0, 0.35, 1);
  --_hover: var(--tt-btn-hover, 0);

  /* size: Medium */
  --_radius: 0.8rem;
  --_radius-hover: 1.1rem;
  --_px: 1rem;
  --_py: 0.5rem;
  --_gap: 0.4rem;
  --_icon: 0.6rem;
  --_min-h: 2.4rem;
  --_text: 0.8rem;
  --_grow-size: 0px;

  /* Geometry shared by the background and both shadow layers, so they always match. */
  --_inset: calc(var(--_grow-size) * var(--_hover) * -1);
  --_r: calc(var(--_radius) + (var(--_radius-hover) - var(--_radius)) * var(--_hover));

  /* icon motion */
  --_icon-x: 0rem;
  --_icon-y: 0rem;
  --_text-x: 0rem;

  /* colors: see "Style x Background" */
  --_bg-image: none;
  --_bg-edge: none;
  --_icon-color: currentColor;
  --_title-color: currentColor;
  --_sub-color: currentColor;
  --_shadow-rest: 0 3.562px 5.386px 0 rgba(0, 0, 0, 0.06), 0 1.408px 2.13px 0 rgba(142, 105, 192, 0.04);
  --_shadow-hover: 0 20px 52px 0 rgba(79, 29, 229, 0.13), 0 14.966px 22.631px 0 rgba(0, 0, 0, 0.09),
    0 7.266px 10.987px 0 rgba(0, 0, 0, 0.07), 0 3.562px 5.386px 0 rgba(0, 0, 0, 0.06),
    0 1.408px 2.13px 0 rgba(142, 105, 192, 0.04);

  position: relative;
  isolation: isolate;
  display: inline-flex;
  vertical-align: middle;
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  color: var(--_fg);
  font: inherit;
  text-decoration: none;
  cursor: pointer;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
  transition: transform var(--_t);
}

.AisLsJaE_AWnIhDlnTUV[data-element="visual"] {
  cursor: inherit;
}

/* Webflow's page-wide box-sizing: border-box doesn't reach into the Shadow DOM. */
.AisLsJaE_AWnIhDlnTUV,
.AisLsJaE_AWnIhDlnTUV *,
.AisLsJaE_AWnIhDlnTUV::before,
.AisLsJaE_AWnIhDlnTUV::after {
  box-sizing: border-box;
}

/* ---------- Size ---------- */

.AisLsJaE_AWnIhDlnTUV[data-size="small"] {
  --_radius: 0.6rem;
  --_radius-hover: 0.9rem;
  --_px: 0.7rem;
  --_gap: 0.3rem;
  --_icon: 0.55rem;
  --_min-h: 2rem;
  --_text: 0.7rem;
}

.AisLsJaE_AWnIhDlnTUV[data-size="x-small"] {
  --_radius: 0.5rem;
  --_radius-hover: 0.75rem;
  --_px: 0.55rem;
  --_py: 0.35rem;
  --_gap: 0.25rem;
  --_icon: 0.45rem;
  --_min-h: 1.6rem;
  --_text: 0.6rem;
}

.AisLsJaE_AWnIhDlnTUV[data-grow] {
  --_grow-size: 0.1em;
}

/* ---------- Style x Background ----------
   Light and dark values are chosen by --tt-dark, a "space toggle":
   unset or initial = light, empty (--tt-dark: ;) = dark. Each color is
   written as  --_d-x: var(--tt-dark) DARK;  --_x: var(--_d-x, LIGHT);
   so the dark value only exists while --tt-dark is set.

   Background Light / Dark set the toggle on the button itself; Auto sets
   nothing and inherits it from a parent, e.g. a dark Card or section. */

.AisLsJaE_AWnIhDlnTUV[data-background="light"],
.kDUuBpexlTtvrccVWYyX[data-background="light"] {
  --tt-dark: initial;
}

.AisLsJaE_AWnIhDlnTUV[data-background="dark"],
.kDUuBpexlTtvrccVWYyX[data-background="dark"] {
  --tt-dark: ;
}

/* Solid: black on light, white on dark. */
.AisLsJaE_AWnIhDlnTUV {
  --_d-fg: var(--tt-dark) var(--black-a-96, rgba(13, 13, 13, 0.96));
  --_d-bg: var(--tt-dark) var(--white-a-100, #fff);
  --_d-glow: var(--tt-dark) rgba(111, 0, 255, 0.14);
  --_fg: var(--_d-fg, var(--white-a-100, #fff));
  --_bg: var(--_d-bg, var(--black-a-96, rgba(13, 13, 13, 0.96)));
  --_glow: var(--_d-glow, rgba(139, 51, 255, 0.55));
}

/* Glass on Dark: for dark or image backgrounds (values from the live site).
   Glass on Light: not styled in Webflow today; frosted white (50%) with a dark
   hairline and a white rim, so it reads as glass on light sections. */
.AisLsJaE_AWnIhDlnTUV[data-style="glass"] {
  --_d-fg: var(--tt-dark) var(--white-a-100, #fff);
  --_d-bg: var(--tt-dark) transparent;
  --_d-bg-image: var(--tt-dark) linear-gradient(315deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.1) 47%, rgba(255, 255, 255, 0.2));
  --_d-bg-edge: var(--tt-dark)
    1.1px 2.2px 0.5px -1.8px rgba(255, 255, 255, 0.9) inset,
    -1px -2.2px 0.5px -1.8px rgba(255, 255, 255, 0.9) inset,
    2px 3px 2px 0 rgba(0, 0, 0, 0.1) inset;
  --_d-blend: var(--tt-dark) lighten;
  --_fg: var(--_d-fg, var(--black-a-96, rgba(13, 13, 13, 0.96)));
  --_bg: var(--_d-bg, rgba(255, 255, 255, 0.5));
  --_bg-image: var(--_d-bg-image, linear-gradient(315deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0.55) 47%, rgba(255, 255, 255, 0.85)));
  --_bg-edge: var(--_d-bg-edge,
    0 0 0 1px rgba(13, 13, 13, 0.1) inset,
    0 0 0 1.5px rgba(255, 255, 255, 0.5) inset,
    1.1px 2.2px 0.5px -1.8px rgba(255, 255, 255, 1) inset,
    -1px -2.2px 0.5px -1.8px rgba(255, 255, 255, 0.9) inset);
  --_glow: rgba(255, 255, 255, 0.35);
}

/* Brand: solid purple, same on light and dark backgrounds. */
.AisLsJaE_AWnIhDlnTUV[data-style="brand"] {
  --_fg: var(--white-a-100, #fff);
  --_bg: var(--purple-600, #6f00ff);
  --_glow: rgba(255, 255, 255, 0.3);
  --_shadow-hover: 0 20px 52px 0 rgba(111, 0, 255, 0.28), 0 14.966px 22.631px 0 rgba(0, 0, 0, 0.09),
    0 7.266px 10.987px 0 rgba(0, 0, 0, 0.07), 0 3.562px 5.386px 0 rgba(0, 0, 0, 0.06),
    0 1.408px 2.13px 0 rgba(142, 105, 192, 0.04);
}

/* Outline: 1px border, no fill at rest; a light tint fades in on hover. */
.AisLsJaE_AWnIhDlnTUV[data-style="outline"] {
  --_d-fg: var(--tt-dark) var(--white-a-100, #fff);
  --_d-bg: var(--tt-dark) rgb(255 255 255 / calc(0.1 * var(--_hover)));
  --_d-bg-edge: var(--tt-dark) 0 0 0 1px var(--white-a-100, #fff) inset;
  --_fg: var(--_d-fg, var(--black-a-96, rgba(13, 13, 13, 0.96)));
  --_bg: var(--_d-bg, rgb(13 13 13 / calc(0.05 * var(--_hover))));
  --_bg-edge: var(--_d-bg-edge, 0 0 0 1px var(--black-a-96, rgba(13, 13, 13, 0.96)) inset);
  --_glow: color-mix(in srgb, currentColor 10%, transparent);
  --_shadow-rest: none;
  --_shadow-hover: none;
}

/* Ghost: like Text but with normal padding and no border; the fill fades in
   on hover. Good for toolbars and icon-only actions. Outline differs by having
   its border at rest. */
.AisLsJaE_AWnIhDlnTUV[data-style="ghost"] {
  --_d-fg: var(--tt-dark) var(--white-a-100, #fff);
  --_d-bg: var(--tt-dark) rgb(255 255 255 / calc(0.12 * var(--_hover)));
  --_fg: var(--_d-fg, var(--black-a-96, rgba(13, 13, 13, 0.96)));
  --_bg: var(--_d-bg, rgb(13 13 13 / calc(0.06 * var(--_hover))));
  --_glow: color-mix(in srgb, currentColor 10%, transparent);
  --_shadow-rest: none;
  --_shadow-hover: none;
}

/* Text buttons have no visible padding, but get an invisible runway of icon + gap
   on both sides (padding pulled back with a negative margin). The arrows travel
   the same way as on filled buttons and fade at the runway edge instead of being
   cut off at the text. */
.AisLsJaE_AWnIhDlnTUV[data-style="text"] {
  --_d-fg: var(--tt-dark) var(--white-a-100, #fff);
  --_fg: var(--_d-fg, var(--black-a-96, rgba(13, 13, 13, 0.96)));
  --_glow: transparent;
  --_px: calc(var(--_icon) + var(--_gap));
  --_bg: transparent;
  --_shadow-rest: none;
  --_shadow-hover: none;
}

/* ---------- Icon and text color ---------- */

.AisLsJaE_AWnIhDlnTUV[data-icon-color="brand"] { --_icon-color: #4c39f9; }
.AisLsJaE_AWnIhDlnTUV[data-icon-color="purple"] { --_icon-color: var(--purple-600, #6f00ff); }
.AisLsJaE_AWnIhDlnTUV[data-icon-color="green"] { --_icon-color: var(--green, #0bda81); }
.AisLsJaE_AWnIhDlnTUV[data-icon-color="orange"] { --_icon-color: var(--orange-500, #ef7953); }
.AisLsJaE_AWnIhDlnTUV[data-icon-color="red"] { --_icon-color: var(--red-300, #f76e85); }
.AisLsJaE_AWnIhDlnTUV[data-icon-color="muted"] { --_icon-color: color-mix(in srgb, currentColor 50%, transparent); }

.AisLsJaE_AWnIhDlnTUV[data-text-color="brand"] { --_title-color: #4c39f9; --_sub-color: #4c39f9; }
.AisLsJaE_AWnIhDlnTUV[data-text-color="purple"] { --_title-color: var(--purple-600, #6f00ff); --_sub-color: var(--purple-600, #6f00ff); }

/* ---------- Icon motion ----------
   Derived from the size tokens so every size keeps the same proportions:
   at rest  [px][text][gap][icon][px]
   on hover [px][icon][gap][text][px]
   The text moves by icon + gap; the visible arrow leaves through the padding
   while the waiting arrow arrives exactly at the padding edge. */

.AisLsJaE_AWnIhDlnTUV[data-icon="arrow-forward"],
.AisLsJaE_AWnIhDlnTUV[data-icon="arrow-back"] {
  --_text-shift: calc(var(--_icon) + var(--_gap));
  --_icon-shift: calc(var(--_px) + var(--_icon) + var(--_gap));
}

.AisLsJaE_AWnIhDlnTUV[data-icon="arrow-forward"] {
  --_icon-x: var(--_icon-shift);
  --_text-x: var(--_text-shift);
}

.AisLsJaE_AWnIhDlnTUV[data-icon="arrow-back"] {
  --_icon-x: calc(var(--_icon-shift) * -1);
  --_text-x: calc(var(--_text-shift) * -1);
}

.AisLsJaE_AWnIhDlnTUV[data-icon="external"] {
  --_icon-x: 0.1em;
  --_icon-y: -0.1em;
}

/* ---------- Icon only ----------
   Square (width = height), icon centered at the same size as next to text.
   The arrow leaves through one side and the waiting arrow arrives in the center. */

.AisLsJaE_AWnIhDlnTUV[data-icon-only] {
  --_icon-shift: calc(var(--_min-h) / 2 + var(--_icon) / 2);
}

/* [data-style] raises specificity above the text style's runway rule. */
.AisLsJaE_AWnIhDlnTUV[data-style][data-icon-only] [data-part="inner"] {
  width: var(--_min-h);
  margin-inline: 0;
  padding: 0;
  justify-content: center;
  overflow: clip;
  -webkit-mask-image: none;
  mask-image: none;
}

.AisLsJaE_AWnIhDlnTUV[data-icon-only] [data-part="icon"][data-pos="outside-start"] {
  left: calc(50% - var(--_icon) / 2 - var(--_icon-shift));
}

.AisLsJaE_AWnIhDlnTUV[data-icon-only] [data-part="icon"][data-pos="outside-end"] {
  right: calc(50% - var(--_icon) / 2 - var(--_icon-shift));
}

/* ---------- Action icons ----------
   Reload, Copy link and Expand don't slide; their parts move in place.
   Reload turns once, the chain links pull apart, the corners spread. */

.AisLsJaE_AWnIhDlnTUV [data-icon-part] {
  transition: transform var(--_t-motion);
}

.AisLsJaE_AWnIhDlnTUV [data-icon-part="spin"] {
  transform-box: view-box;
  transform-origin: 12px 12px;
  transform: rotate(calc(360deg * var(--_hover)));
}

.AisLsJaE_AWnIhDlnTUV [data-icon-part="start"] { transform: translateX(calc(-2px * var(--_hover))); }
.AisLsJaE_AWnIhDlnTUV [data-icon-part="end"] { transform: translateX(calc(2px * var(--_hover))); }

.AisLsJaE_AWnIhDlnTUV [data-icon-part="top-left"] { transform: translate(calc(-2px * var(--_hover)), calc(-2px * var(--_hover))); }
.AisLsJaE_AWnIhDlnTUV [data-icon-part="top-right"] { transform: translate(calc(2px * var(--_hover)), calc(-2px * var(--_hover))); }
.AisLsJaE_AWnIhDlnTUV [data-icon-part="bottom-right"] { transform: translate(calc(2px * var(--_hover)), calc(2px * var(--_hover))); }
.AisLsJaE_AWnIhDlnTUV [data-icon-part="bottom-left"] { transform: translate(calc(-2px * var(--_hover)), calc(2px * var(--_hover))); }

/* Line icons read smaller than the filled arrows at the same box size, so they
   take the text size of the button size (0.6 / 0.7 / 0.8rem). */
.AisLsJaE_AWnIhDlnTUV:is([data-icon="reload"], [data-icon="copy-link"], [data-icon="expand"]) {
  --_icon: var(--_text);
}

/* Stroke icons overflow their box a little when the parts spread. */
.AisLsJaE_AWnIhDlnTUV:is([data-icon="reload"], [data-icon="copy-link"], [data-icon="expand"]) [data-part="icon"] svg {
  overflow: visible;
}

/* ---------- States ---------- */

/* Real hover only on devices that hover; touch uses data-touch so states don't stick. */
@media (hover: hover) {
  .AisLsJaE_AWnIhDlnTUV:not([data-element="visual"]):hover {
    --_hover: 1;
  }
}

.AisLsJaE_AWnIhDlnTUV:not([data-element="visual"]):is(:focus-visible, [data-touch]) {
  --_hover: 1;
}

.AisLsJaE_AWnIhDlnTUV:not([data-element="visual"]):is(:active, [data-touch="active"]) {
  transform: scale(0.95);
}

.AisLsJaE_AWnIhDlnTUV:focus-visible {
  outline: 3px solid rgba(59, 130, 246, 0.55);
  outline-offset: 3px;
}

/* Rest and hover shadow live on pseudo layers behind the background. They follow
   the background's geometry and sit 1px inside it, so no light seam shows at the
   anti-aliased edge. */
.AisLsJaE_AWnIhDlnTUV::before,
.AisLsJaE_AWnIhDlnTUV::after {
  content: "";
  position: absolute;
  z-index: 0;
  inset: calc(var(--_inset) + 1px);
  border-radius: var(--_r);
  pointer-events: none;
  transition:
    inset var(--_t),
    border-radius var(--_t),
    opacity var(--_t),
    transform var(--_t);
}

.AisLsJaE_AWnIhDlnTUV::before {
  box-shadow: var(--_shadow-rest);
}

/* Solid fills get the same color underneath, so the anti-aliased edge of the
   background never lets the page shine through (white flash on dark buttons). */
.AisLsJaE_AWnIhDlnTUV:is([data-style="solid"], [data-style="brand"])::before {
  background-color: var(--_bg);
}

/* The hover shadow drops 2px on hover. Its layer is 2px smaller on top of the
   1px base inset, so it never pokes out below the background: a box-shadow isn't
   painted inside its own box, and that uncovered strip showed as a white edge. */
.AisLsJaE_AWnIhDlnTUV::after {
  inset: calc(var(--_inset) + 3px);
  box-shadow: var(--_shadow-hover);
  opacity: var(--_hover);
  transform: translateY(calc(2px * var(--_hover)));
}

.AisLsJaE_AWnIhDlnTUV:not([data-element="visual"]):is(:active, [data-touch="active"])::after {
  opacity: 0;
  transform: none;
}

/* Shadow follow: the hover shadow moves away from the cursor, as if the light
   came from the pointer (--_sx / --_sy are -0.5 … 0.5, set by useSpotlight).
   Same transition as the shadow itself, so it trails the mouse softly. */
.AisLsJaE_AWnIhDlnTUV[data-shadow-follow]::after {
  transform: translate(
    calc(var(--_sx, 0) * -32px * var(--_hover)),
    calc((2px + var(--_sy, 0) * -20px) * var(--_hover))
  );
}

.AisLsJaE_AWnIhDlnTUV[data-shadow-blend="multiply"]::after { mix-blend-mode: multiply; }
.AisLsJaE_AWnIhDlnTUV[data-shadow-blend="overlay"]::after { mix-blend-mode: overlay; }
.AisLsJaE_AWnIhDlnTUV[data-shadow-blend="screen"]::after { mix-blend-mode: screen; }
.AisLsJaE_AWnIhDlnTUV[data-shadow-blend="soft-light"]::after { mix-blend-mode: soft-light; }

/* ---------- Parts ---------- */

.Z58NGcerr0eBSq6vobE7 {
  display: block;
}

.AisLsJaE_AWnIhDlnTUV [data-part="bg"] {
  position: absolute;
  z-index: 1;
  inset: var(--_inset);
  overflow: hidden;
  border-radius: var(--_r);
  background-color: var(--_bg);
  background-image: var(--_bg-image);
  box-shadow: var(--_bg-edge);
  transition:
    inset var(--_t),
    border-radius var(--_t),
    background-color var(--_t);
}

/* Frosted: blur plus a little extra saturation, so colors behind the button
   glow through instead of turning grey. */
.AisLsJaE_AWnIhDlnTUV[data-style="glass"] [data-part="bg"] {
  -webkit-backdrop-filter: blur(30px) saturate(170%);
  backdrop-filter: blur(30px) saturate(170%);
}

.AisLsJaE_AWnIhDlnTUV[data-style="glass"] [data-part="bg"] {
  mix-blend-mode: var(--_d-blend, normal);
}

.AisLsJaE_AWnIhDlnTUV [data-part="inner"] {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: var(--_gap);
  min-height: var(--_min-h);
  padding: var(--_py) var(--_px);
  overflow: clip;
}

.AisLsJaE_AWnIhDlnTUV[data-style="text"] [data-part="inner"] {
  margin-inline: calc(var(--_px) * -1);
  overflow: visible;
  -webkit-mask-image: linear-gradient(to right, transparent, #000 var(--_px), #000 calc(100% - var(--_px)), transparent);
  mask-image: linear-gradient(to right, transparent, #000 var(--_px), #000 calc(100% - var(--_px)), transparent);
}

.AisLsJaE_AWnIhDlnTUV [data-part="icon"] {
  display: flex;
  flex: none;
  align-items: center;
  justify-content: center;
  width: var(--_icon);
  height: var(--_icon);
  color: var(--_icon-color);
  transform: translate(calc(var(--_icon-x) * var(--_hover)), calc(var(--_icon-y) * var(--_hover)));
  transition: transform var(--_t-motion);
}

.AisLsJaE_AWnIhDlnTUV [data-part="icon"] svg {
  display: block;
  width: 100%;
  height: 100%;
}

.AisLsJaE_AWnIhDlnTUV[data-icon="arrow-back"] [data-part="icon"] svg {
  transform: scaleX(-1);
}

/* The second arrow waits outside the clipped inner box and slides in on hover. */
.AisLsJaE_AWnIhDlnTUV [data-part="icon"][data-pos="outside-start"] {
  position: absolute;
  left: calc(var(--_px) - var(--_icon-shift));
}

.AisLsJaE_AWnIhDlnTUV [data-part="icon"][data-pos="outside-end"] {
  position: absolute;
  right: calc(var(--_px) - var(--_icon-shift));
}

.AisLsJaE_AWnIhDlnTUV [data-part="text"] {
  display: flex;
  flex-direction: column;
  gap: 0.1em;
  font-size: var(--_text);
  line-height: 1.1;
  white-space: nowrap;
  transform: translateX(calc(var(--_text-x) * var(--_hover)));
  transition: transform var(--_t-motion);
}

.AisLsJaE_AWnIhDlnTUV [data-part="title"] {
  color: var(--_title-color);
  font-weight: 600;
  font-feature-settings: "ss03" on, "ss08" on, "ss12" on;
}

.AisLsJaE_AWnIhDlnTUV [data-part="prefix"] {
  display: inline;
  font-weight: 400;
}

.AisLsJaE_AWnIhDlnTUV [data-part="sub"] {
  color: var(--_sub-color);
  font-size: 0.8em;
  opacity: 0.6;
}

.AisLsJaE_AWnIhDlnTUV:not([data-element="visual"]):is(:active, [data-touch="active"]) :is([data-part="bg"], [data-part="icon"], [data-part="text"]) {
  transition-duration: var(--_t-press);
}

/* ---------- Spotlight ---------- */

.AisLsJaE_AWnIhDlnTUV [data-part="glow"] {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(circle 4.5rem at var(--_mx, 50%) var(--_my, 50%), var(--_glow), transparent 70%);
  opacity: var(--_hover);
  transition: opacity var(--_t);
}

/* ---------- Note ---------- */

.kDUuBpexlTtvrccVWYyX {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.5rem;
  vertical-align: top;
}

/* Zero width: the note never widens the component. As a flex row its text
   overflows to the right (Start) or evenly to both sides (Center). */
.kDUuBpexlTtvrccVWYyX [data-part="note"] {
  display: flex;
  justify-content: flex-start;
  width: 0;
  overflow: visible;
  white-space: nowrap;
  font-size: 0.7rem;
  line-height: 1.3;
  --_d-note: var(--tt-dark) var(--white-a-60, rgba(255, 255, 255, 0.6));
  color: var(--_d-note, var(--black-a-60, rgba(13, 13, 13, 0.6)));
}

.kDUuBpexlTtvrccVWYyX[data-note-align="center"] {
  align-items: center;
}

.kDUuBpexlTtvrccVWYyX[data-note-align="center"] [data-part="note"] {
  justify-content: center;
}


/* ---------- Reveal ---------- */

.AisLsJaE_AWnIhDlnTUV [data-part="reveal"] {
  position: absolute;
  inset: 0;
  opacity: 0;
  pointer-events: none;
  clip-path: circle(0px at var(--_reveal-x, 50%) var(--_reveal-y, 50%));
  transition:
    clip-path 380ms cubic-bezier(0.55, 0, 0.2, 1),
    opacity 220ms ease 80ms;
}

.AisLsJaE_AWnIhDlnTUV[data-reveal="resetting"] [data-part="reveal"] {
  transition: none;
}

.AisLsJaE_AWnIhDlnTUV[data-reveal="armed"] [data-part="reveal"] {
  opacity: 0.45;
  clip-path: circle(0.55em at var(--_reveal-x, 50%) var(--_reveal-y, 50%));
}

.AisLsJaE_AWnIhDlnTUV[data-reveal="revealing"] [data-part="reveal"] {
  opacity: 1;
  clip-path: circle(var(--_reveal-r, 0px) at var(--_reveal-x, 50%) var(--_reveal-y, 50%));
}

.AisLsJaE_AWnIhDlnTUV[data-reveal="fadeout"] [data-part="reveal"] {
  opacity: 0;
}

.AisLsJaE_AWnIhDlnTUV [data-part="shader"] {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(140px 90px at 25% 30%, rgba(255, 255, 255, 0.35), rgba(255, 255, 255, 0) 70%),
    radial-gradient(120px 120px at 80% 70%, rgba(0, 255, 255, 0.22), rgba(0, 255, 255, 0) 65%),
    linear-gradient(135deg, rgba(255, 0, 200, 0.18), rgba(0, 120, 255, 0.18));
  opacity: 0.95;
  mix-blend-mode: overlay;
}

/* ---------- Reduced motion ---------- */

@media (prefers-reduced-motion: reduce) {
  .AisLsJaE_AWnIhDlnTUV {
    --_icon-x: 0rem;
    --_icon-y: 0rem;
    --_text-x: 0rem;
    --_grow-size: 0px;
  }

  .AisLsJaE_AWnIhDlnTUV:not([data-element="visual"]):is(:active, [data-touch="active"]) {
    transform: none;
  }

  .AisLsJaE_AWnIhDlnTUV [data-part="reveal"] {
    display: none;
  }

  .AisLsJaE_AWnIhDlnTUV [data-icon-part] {
    transform: none;
  }
}