.twh-halo,
.twh-large-halo,
.twh-mini-halo {
  --twh-size: 280px;
  --twh-ring-thickness: calc(var(--twh-size) * 0.0312);
  --twh-glow-scale: 1.02;
  --twh-glow-blur: calc(var(--twh-ring-thickness) * 0.72);
  --twh-band-outset: 3px;
  --twh-band-inset: 3px;
  --twh-band-core-edge: 2.6px;
  --twh-band-soft-10: 0.35px;
  --twh-band-soft-20: 0.7px;
  --twh-band-soft-50: 1.2px;
  --twh-band-soft-80: 1.85px;
  --twh-band-soft-90: 2.25px;
  --twh-speed: 12000ms;
  --twh-light-speed: 9000ms;
  --twh-transition-duration: 760ms;
  --twh-transition-easing: cubic-bezier(.22, 1, .36, 1);
  --twh-transition-progress: 0;
  --twh-motion-angle: 18deg;
  --twh-pulse-scale: 1.012;
  --twh-base-opacity: 0.78;
  --twh-tail-opacity: 0.72;
  --twh-front-opacity: 0.96;
  --twh-core-opacity: 0.88;
  --twh-glow-opacity: 0.34;
  --twh-a: #642cff;
  --twh-b: #2d5bff;
  --twh-c: #c234ff;
  --twh-d: #ff355e;
  --twh-e: #23d7ff;
  --twh-f: #ff8a18;
  --twh-g: #35db74;
  --twh-ring-gradient: conic-gradient(
    from 214deg,
    var(--twh-a) 0deg,
    var(--twh-b) 58deg,
    var(--twh-e) 92deg,
    var(--twh-b) 128deg,
    var(--twh-c) 188deg,
    var(--twh-d) 250deg,
    var(--twh-f) 292deg,
    var(--twh-a) 360deg
  );
  --twh-base-gradient: conic-gradient(
    from 214deg,
    color-mix(in srgb, var(--twh-a) 78%, white 22%) 0deg,
    color-mix(in srgb, var(--twh-b) 72%, white 28%) 70deg,
    color-mix(in srgb, var(--twh-e) 50%, white 50%) 112deg,
    color-mix(in srgb, var(--twh-c) 68%, white 32%) 184deg,
    color-mix(in srgb, var(--twh-d) 68%, white 32%) 252deg,
    color-mix(in srgb, var(--twh-f) 54%, white 46%) 296deg,
    color-mix(in srgb, var(--twh-a) 78%, white 22%) 360deg
  );
  --twh-tail-gradient: conic-gradient(
    from 236deg,
    transparent 0deg,
    color-mix(in srgb, var(--twh-a) 28%, transparent) 22deg,
    color-mix(in srgb, var(--twh-b) 54%, transparent) 70deg,
    color-mix(in srgb, var(--twh-e) 62%, transparent) 122deg,
    color-mix(in srgb, var(--twh-c) 46%, transparent) 174deg,
    color-mix(in srgb, var(--twh-d) 22%, transparent) 230deg,
    transparent 320deg,
    transparent 360deg
  );
  --twh-front-gradient: conic-gradient(
    from 236deg,
    transparent 0deg,
    transparent 82deg,
    color-mix(in srgb, var(--twh-e) 70%, transparent) 100deg,
    color-mix(in srgb, var(--twh-b) 92%, white 8%) 116deg,
    color-mix(in srgb, var(--twh-c) 90%, white 10%) 136deg,
    color-mix(in srgb, var(--twh-d) 72%, transparent) 164deg,
    transparent 202deg,
    transparent 360deg
  );
  --twh-core-gradient: conic-gradient(
    from 236deg,
    transparent 0deg,
    transparent 104deg,
    color-mix(in srgb, white 36%, var(--twh-e) 64%) 114deg,
    color-mix(in srgb, white 28%, var(--twh-b) 72%) 124deg,
    color-mix(in srgb, white 24%, var(--twh-c) 76%) 134deg,
    transparent 154deg,
    transparent 360deg
  );
  --twh-glow-gradient: conic-gradient(
    from 214deg,
    color-mix(in srgb, var(--twh-a) 26%, transparent) 0deg,
    color-mix(in srgb, var(--twh-b) 24%, transparent) 76deg,
    color-mix(in srgb, var(--twh-e) 22%, transparent) 120deg,
    color-mix(in srgb, var(--twh-c) 24%, transparent) 192deg,
    color-mix(in srgb, var(--twh-d) 28%, transparent) 262deg,
    color-mix(in srgb, var(--twh-f) 18%, transparent) 306deg,
    color-mix(in srgb, var(--twh-a) 26%, transparent) 360deg
  );
  --twh-prev-base-gradient: var(--twh-base-gradient);
  --twh-prev-tail-gradient: var(--twh-tail-gradient);
  --twh-prev-front-gradient: var(--twh-front-gradient);
  --twh-prev-core-gradient: var(--twh-core-gradient);
  --twh-prev-glow-gradient: var(--twh-glow-gradient);
  --twh-prev-base-opacity: var(--twh-base-opacity);
  --twh-prev-tail-opacity: var(--twh-tail-opacity);
  --twh-prev-front-opacity: var(--twh-front-opacity);
  --twh-prev-core-opacity: var(--twh-core-opacity);
  --twh-prev-glow-opacity: var(--twh-glow-opacity);
  --twh-energy-scale: 1.01;
  --twh-breath-scale: 1.006;
  --twh-breath-opacity: 1.02;
  --twh-front-focus-scale: 1.01;
  --twh-global-cycle-duration: 60000ms;
  --twh-global-elapsed: 0ms;
  --twh-phase-u: 0;
  --twh-theta: 0;
  --twh-loop-count: 0;
  --twh-phase-rotation: 0deg;
  --twh-tail-rotation: 0deg;
  --twh-front-rotation: 0deg;
  --twh-core-rotation: 0deg;
  --twh-glow-rotation: 0deg;
  --twh-composite-scale: 1;
  --twh-tail-scale: 1;
  --twh-front-scale: 1;
  --twh-core-scale: 1;
  --twh-glow-dynamic-scale: 1;
  --twh-tail-opacity-dynamic: 1;
  --twh-front-opacity-dynamic: 1;
  --twh-core-opacity-dynamic: 1;
  --twh-glow-opacity-dynamic: 1;
  --twh-active-width: 1;
  --twh-tail-width: 1;
  --twh-glow-strength: 1;
  position: relative;
  display: inline-grid;
  place-items: center;
  width: var(--twh-size);
  height: var(--twh-size);
  aspect-ratio: 1 / 1;
  border-radius: 50%;
  background: transparent;
  contain: layout;
  isolation: isolate;
  pointer-events: none;
  transition:
    opacity var(--twh-transition-duration) var(--twh-transition-easing),
    filter var(--twh-transition-duration) var(--twh-transition-easing);
}

.twh-halo--large,
.twh-large-halo {
  --twh-size: var(--halo-large-size, clamp(280px, 72vw, 320px));
  --twh-ring-thickness: calc(var(--twh-size) * 0.0312);
  --twh-glow-blur: calc(var(--twh-ring-thickness) * 0.72);
}

.twh-halo--mini,
.twh-mini-halo {
  --twh-size: var(--halo-mini-size, clamp(36px, 10vw, 40px));
  --twh-ring-thickness: 2.288px;
  --twh-band-outset: 0.8px;
  --twh-band-inset: 0.8px;
  --twh-band-core-edge: 0.56px;
  --twh-band-soft-10: 0.08px;
  --twh-band-soft-20: 0.14px;
  --twh-band-soft-50: 0.24px;
  --twh-band-soft-80: 0.36px;
  --twh-band-soft-90: 0.46px;
  --twh-glow-scale: 1.04;
  --twh-glow-blur: 0.9px;
  --twh-base-opacity: 0.84;
  --twh-tail-opacity: 0.78;
  --twh-front-opacity: 1;
  --twh-core-opacity: 0.94;
  --twh-glow-opacity: 0.36;
  vertical-align: middle;
}

.twh-asset-halo {
  overflow: visible;
  background: transparent;
  filter: none;
  contain: layout style;
  --halo-visible-size: var(--twh-size);
  --halo-safe-area-ratio: 0;
  --halo-safe-area: calc(var(--halo-visible-size) * var(--halo-safe-area-ratio));
  --halo-canvas-size: calc(var(--halo-visible-size) + var(--halo-safe-area) + var(--halo-safe-area));
  --halo-canvas-offset: calc(var(--halo-safe-area) * -1);
  --twh-asset-visual-offset-x: 0px;
  --twh-asset-visual-offset-y: 0px;
  --twh-asset-motion-duration: 16000ms;
  --twh-asset-motion-angle: 22deg;
  --twh-asset-breath-scale: 1.028;
  --twh-asset-brightness: 1;
  --twh-asset-saturation: 1.34;
  --twh-asset-contrast: 1.12;
  --twh-asset-brightness-multiplier: 1;
  --twh-asset-saturation-multiplier: 1;
  --twh-asset-glow-a: rgba(100, 44, 255, 0.38);
  --twh-asset-glow-b: rgba(35, 215, 255, 0.25);
  --twh-asset-glow-c: rgba(255, 53, 94, 0.2);
  --twh-asset-glow-filter: drop-shadow(0 0 7px rgba(123, 97, 255, 0.32)) drop-shadow(0 0 24px rgba(123, 97, 255, 0.34)) drop-shadow(0 0 12px rgba(45, 91, 255, 0.2));
}

.twh-asset-halo--large {
  --twh-size: var(--halo-large-size, clamp(280px, 72vw, 320px));
  --halo-safe-area-ratio: 0.209375;
  --twh-asset-visual-offset-x: 58px;
  --twh-asset-glow-a: rgba(100, 44, 255, 0.44);
  --twh-asset-glow-b: rgba(35, 215, 255, 0.28);
  --twh-asset-glow-c: rgba(255, 53, 94, 0.22);
  --twh-asset-glow-filter: drop-shadow(0 0 9px rgba(123, 97, 255, 0.34)) drop-shadow(0 0 42px rgba(123, 97, 255, 0.48)) drop-shadow(0 0 22px rgba(45, 91, 255, 0.3)) drop-shadow(0 0 8px rgba(194, 52, 255, 0.24));
}

.twh-asset-halo--mini {
  --twh-size: var(--halo-mini-size, clamp(36px, 10vw, 40px));
  --halo-safe-area-ratio: 0.2083333333;
  --twh-asset-visual-offset-x: 0px;
  --twh-asset-visual-offset-y: 0px;
  --twh-asset-motion-angle: 16deg;
  --twh-asset-breath-scale: 1.018;
  --twh-asset-brightness-multiplier: 0.96;
  --twh-asset-saturation-multiplier: 0.98;
  --twh-asset-glow-a: rgba(100, 44, 255, 0.3);
  --twh-asset-glow-b: rgba(35, 215, 255, 0.2);
  --twh-asset-glow-c: rgba(255, 53, 94, 0.14);
  --twh-asset-glow-filter: drop-shadow(0 0 5px rgba(123, 97, 255, 0.36)) drop-shadow(0 0 18px rgba(123, 97, 255, 0.42)) drop-shadow(0 0 8px rgba(45, 91, 255, 0.28));
}

.twh-asset-halo__image {
  display: block;
  position: absolute;
  inset: calc(var(--halo-canvas-offset) + var(--twh-asset-visual-offset-y)) auto auto calc(var(--halo-canvas-offset) + var(--twh-asset-visual-offset-x));
  width: var(--halo-canvas-size);
  height: var(--halo-canvas-size);
  object-fit: contain;
  border: 0;
  background: transparent;
  pointer-events: none;
  user-select: none;
  transform-origin: 50% 50%;
  filter:
    brightness(calc(var(--twh-asset-brightness) * var(--twh-asset-brightness-multiplier)))
    saturate(calc(var(--twh-asset-saturation) * var(--twh-asset-saturation-multiplier)))
    contrast(var(--twh-asset-contrast))
    var(--twh-asset-glow-filter);
  animation: twhCanonicalAssetMotion var(--twh-asset-motion-duration) cubic-bezier(.42, 0, .22, 1) infinite;
  will-change: transform;
}

.tw-bottom-nav__halo-slot .twh-asset-halo__image {
  inset: calc(var(--halo-canvas-offset) + var(--twh-asset-visual-offset-y)) auto auto calc(var(--halo-canvas-offset) + var(--twh-asset-visual-offset-x));
  width: var(--halo-canvas-size);
  height: var(--halo-canvas-size);
}

.twh-asset-halo[data-halo-asset-state="idle"] {
  --twh-asset-motion-duration: 18000ms;
  --twh-asset-motion-angle: 14deg;
  --twh-asset-breath-scale: 1.018;
  --twh-asset-brightness: 1;
  --twh-asset-saturation: 1.32;
  --twh-asset-contrast: 1.12;
  --twh-asset-glow-filter: drop-shadow(0 0 7px rgba(106, 45, 255, 0.3)) drop-shadow(0 0 28px rgba(106, 45, 255, 0.34)) drop-shadow(0 0 12px rgba(82, 166, 255, 0.18));
}

.twh-asset-halo[data-halo-asset-state="listening"] {
  --twh-asset-motion-duration: 6800ms;
  --twh-asset-motion-angle: 28deg;
  --twh-asset-breath-scale: 1.044;
  --twh-asset-brightness: 1.02;
  --twh-asset-saturation: 1.54;
  --twh-asset-contrast: 1.16;
  --twh-asset-glow-filter: drop-shadow(0 0 7px rgba(30, 219, 255, 0.34)) drop-shadow(0 0 32px rgba(30, 219, 255, 0.4)) drop-shadow(0 0 16px rgba(0, 75, 255, 0.32));
}

.twh-asset-halo[data-halo-asset-state="understanding"] {
  --twh-asset-motion-duration: 8800ms;
  --twh-asset-motion-angle: 23deg;
  --twh-asset-breath-scale: 1.032;
  --twh-asset-brightness: 1.01;
  --twh-asset-saturation: 1.48;
  --twh-asset-contrast: 1.15;
  --twh-asset-glow-filter: drop-shadow(0 0 7px rgba(139, 54, 255, 0.34)) drop-shadow(0 0 30px rgba(139, 54, 255, 0.38)) drop-shadow(0 0 14px rgba(255, 47, 141, 0.26));
}

.twh-asset-halo[data-halo-asset-state="thinking"] {
  --twh-asset-motion-duration: 7200ms;
  --twh-asset-motion-angle: 34deg;
  --twh-asset-breath-scale: 1.038;
  --twh-asset-brightness: 1.02;
  --twh-asset-saturation: 1.56;
  --twh-asset-contrast: 1.17;
  --twh-asset-glow-filter: drop-shadow(0 0 7px rgba(95, 53, 255, 0.36)) drop-shadow(0 0 34px rgba(95, 53, 255, 0.42)) drop-shadow(0 0 16px rgba(214, 59, 255, 0.32));
}

.twh-asset-halo[data-halo-asset-state="responding"] {
  --twh-asset-motion-duration: 5600ms;
  --twh-asset-motion-angle: 38deg;
  --twh-asset-breath-scale: 1.048;
  --twh-asset-brightness: 1.02;
  --twh-asset-saturation: 1.58;
  --twh-asset-contrast: 1.17;
  --twh-asset-glow-filter: drop-shadow(0 0 7px rgba(187, 51, 255, 0.36)) drop-shadow(0 0 34px rgba(187, 51, 255, 0.42)) drop-shadow(0 0 18px rgba(255, 43, 194, 0.3));
}

.twh-asset-halo[data-halo-asset-state="success"] {
  --twh-asset-motion-duration: 1800ms;
  --twh-asset-motion-angle: 8deg;
  --twh-asset-breath-scale: 1.026;
  --twh-asset-brightness: 1.03;
  --twh-asset-saturation: 1.92;
  --twh-asset-contrast: 1.26;
  --twh-asset-glow-filter: drop-shadow(0 0 6px rgba(53, 221, 116, 0.42)) drop-shadow(0 0 30px rgba(53, 221, 116, 0.38)) drop-shadow(0 0 15px rgba(38, 215, 184, 0.3));
}

.twh-asset-halo[data-halo-asset-state="success"] .twh-asset-halo__image {
  animation: twhCanonicalAssetSuccess 1800ms cubic-bezier(.2, .72, .24, 1) 1 both;
}

.twh-asset-halo[data-halo-asset-state="error"] {
  --twh-asset-motion-duration: 1400ms;
  --twh-asset-motion-angle: 6deg;
  --twh-asset-breath-scale: 1.014;
  --twh-asset-brightness: 1.02;
  --twh-asset-saturation: 1.9;
  --twh-asset-contrast: 1.26;
  --twh-asset-glow-filter: drop-shadow(0 0 6px rgba(255, 31, 54, 0.44)) drop-shadow(0 0 28px rgba(255, 31, 54, 0.38)) drop-shadow(0 0 14px rgba(255, 53, 79, 0.32));
}

.twh-asset-halo[data-halo-asset-state="error"] .twh-asset-halo__image {
  animation: twhCanonicalAssetError 1400ms cubic-bezier(.32, .64, .24, 1) 1 both;
}

.twh-asset-halo[data-halo-asset-state="disabled"] .twh-asset-halo__image {
  animation: none;
  opacity: 0.58;
  filter: none;
}

@keyframes twhCanonicalAssetMotion {
  0% {
    transform: rotate(calc(var(--twh-asset-motion-angle) * -0.45)) scale(1);
  }
  34% {
    transform: rotate(calc(var(--twh-asset-motion-angle) * 0.18)) scale(var(--twh-asset-breath-scale));
  }
  68% {
    transform: rotate(calc(var(--twh-asset-motion-angle) * 0.62)) scale(1.008);
  }
  100% {
    transform: rotate(calc(var(--twh-asset-motion-angle) * -0.45)) scale(1);
  }
}

@keyframes twhCanonicalAssetSuccess {
  0% {
    transform: rotate(calc(var(--twh-asset-motion-angle) * -0.4)) scale(1);
  }
  42% {
    transform: rotate(calc(var(--twh-asset-motion-angle) * 0.55)) scale(1.006);
  }
  100% {
    transform: rotate(calc(var(--twh-asset-motion-angle) * 0.82)) scale(1);
  }
}

@keyframes twhCanonicalAssetError {
  0% {
    transform: rotate(calc(var(--twh-asset-motion-angle) * -0.5)) scale(1);
  }
  34% {
    transform: rotate(0deg) scale(1.004);
  }
  100% {
    transform: rotate(calc(var(--twh-asset-motion-angle) * 0.35)) scale(1);
  }
}

.twh-asset-halo[data-reduced-motion="true"] {
  --twh-asset-motion-duration: 30000ms;
  --twh-asset-motion-angle: 3deg;
  --twh-asset-breath-scale: 1.003;
}

.twh-asset-halo[data-reduced-motion="true"] .twh-asset-halo__image {
  filter: none;
}

.twh-asset-halo[data-halo-asset-state="success"][data-reduced-motion="true"] .twh-asset-halo__image,
.twh-asset-halo[data-halo-asset-state="error"][data-reduced-motion="true"] .twh-asset-halo__image {
  animation-duration: 900ms;
}

.twh-asset-halo[data-halo-asset-state="disabled"][data-reduced-motion="true"] .twh-asset-halo__image {
  animation: none;
  filter: none;
}

.twh-halo__layer,
.twh-halo__ring,
.twh-halo__light,
.twh-halo__glow,
.twh-large-halo__ring,
.twh-large-halo__light,
.twh-large-halo__glow,
.twh-mini-halo__ring,
.twh-mini-halo__light,
.twh-mini-halo__glow {
  position: absolute;
  inset: calc(var(--twh-band-outset) * -1);
  border-radius: 50%;
  pointer-events: none;
  padding: 0;
  mask: radial-gradient(
    farthest-side,
    transparent calc(100% - var(--twh-band-outset) - var(--twh-ring-thickness) - var(--twh-band-inset)),
    rgba(0, 0, 0, .1) calc(100% - var(--twh-band-outset) - var(--twh-ring-thickness) - var(--twh-band-inset) + var(--twh-band-soft-10)),
    rgba(0, 0, 0, .2) calc(100% - var(--twh-band-outset) - var(--twh-ring-thickness) - var(--twh-band-inset) + var(--twh-band-soft-20)),
    rgba(0, 0, 0, .5) calc(100% - var(--twh-band-outset) - var(--twh-ring-thickness) - var(--twh-band-inset) + var(--twh-band-soft-50)),
    rgba(0, 0, 0, .8) calc(100% - var(--twh-band-outset) - var(--twh-ring-thickness) - var(--twh-band-inset) + var(--twh-band-soft-80)),
    rgba(0, 0, 0, .9) calc(100% - var(--twh-band-outset) - var(--twh-ring-thickness) - var(--twh-band-inset) + var(--twh-band-soft-90)),
    #000 calc(100% - var(--twh-band-outset) - var(--twh-ring-thickness) + var(--twh-band-core-edge)),
    #000 calc(100% - var(--twh-band-outset) - var(--twh-band-core-edge)),
    rgba(0, 0, 0, .9) calc(100% - var(--twh-band-outset) - var(--twh-band-soft-90)),
    rgba(0, 0, 0, .8) calc(100% - var(--twh-band-outset) - var(--twh-band-soft-80)),
    rgba(0, 0, 0, .5) calc(100% - var(--twh-band-outset) - var(--twh-band-soft-50)),
    rgba(0, 0, 0, .2) calc(100% - var(--twh-band-outset) - var(--twh-band-soft-20)),
    rgba(0, 0, 0, .1) calc(100% - var(--twh-band-outset) - var(--twh-band-soft-10)),
    transparent 100%
  );
  -webkit-mask: radial-gradient(
    farthest-side,
    transparent calc(100% - var(--twh-band-outset) - var(--twh-ring-thickness) - var(--twh-band-inset)),
    rgba(0, 0, 0, .1) calc(100% - var(--twh-band-outset) - var(--twh-ring-thickness) - var(--twh-band-inset) + var(--twh-band-soft-10)),
    rgba(0, 0, 0, .2) calc(100% - var(--twh-band-outset) - var(--twh-ring-thickness) - var(--twh-band-inset) + var(--twh-band-soft-20)),
    rgba(0, 0, 0, .5) calc(100% - var(--twh-band-outset) - var(--twh-ring-thickness) - var(--twh-band-inset) + var(--twh-band-soft-50)),
    rgba(0, 0, 0, .8) calc(100% - var(--twh-band-outset) - var(--twh-ring-thickness) - var(--twh-band-inset) + var(--twh-band-soft-80)),
    rgba(0, 0, 0, .9) calc(100% - var(--twh-band-outset) - var(--twh-ring-thickness) - var(--twh-band-inset) + var(--twh-band-soft-90)),
    #000 calc(100% - var(--twh-band-outset) - var(--twh-ring-thickness) + var(--twh-band-core-edge)),
    #000 calc(100% - var(--twh-band-outset) - var(--twh-band-core-edge)),
    rgba(0, 0, 0, .9) calc(100% - var(--twh-band-outset) - var(--twh-band-soft-90)),
    rgba(0, 0, 0, .8) calc(100% - var(--twh-band-outset) - var(--twh-band-soft-80)),
    rgba(0, 0, 0, .5) calc(100% - var(--twh-band-outset) - var(--twh-band-soft-50)),
    rgba(0, 0, 0, .2) calc(100% - var(--twh-band-outset) - var(--twh-band-soft-20)),
    rgba(0, 0, 0, .1) calc(100% - var(--twh-band-outset) - var(--twh-band-soft-10)),
    transparent 100%
  );
}

.twh-halo__base,
.twh-large-halo__ring,
.twh-mini-halo__ring {
  z-index: 1;
  background:
    var(--twh-base-gradient),
    var(--twh-ring-gradient);
  background-blend-mode: screen, normal;
  opacity: var(--twh-base-opacity);
  filter: drop-shadow(0 0 calc(var(--twh-ring-thickness) * 0.32) color-mix(in srgb, var(--twh-a) 14%, transparent));
  transition:
    opacity var(--twh-transition-duration) var(--twh-transition-easing),
    filter var(--twh-transition-duration) var(--twh-transition-easing);
}

.twh-large-halo[data-halo-presentation="large"] .twh-halo__base,
.twh-large-halo[data-halo-presentation="large"] .twh-large-halo__ring {
  transform: scale(var(--twh-composite-scale));
  transform-origin: 50% 50%;
}

.twh-halo__tail {
  z-index: 2;
  background: var(--twh-tail-gradient);
  opacity: calc(var(--twh-tail-opacity) * var(--twh-tail-opacity-dynamic));
  filter: blur(calc(var(--twh-ring-thickness) * 0.08));
  transform: rotate(var(--twh-tail-rotation)) scale(var(--twh-tail-scale));
  animation-name: none;
  animation-duration: var(--twh-speed);
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
  transition:
    opacity var(--twh-transition-duration) var(--twh-transition-easing),
    filter var(--twh-transition-duration) var(--twh-transition-easing);
}

.twh-halo__front,
.twh-large-halo__light,
.twh-mini-halo__light {
  z-index: 3;
  background: var(--twh-front-gradient);
  opacity: calc(var(--twh-front-opacity) * var(--twh-front-opacity-dynamic));
  filter: drop-shadow(0 0 calc(var(--twh-ring-thickness) * 0.42) color-mix(in srgb, var(--twh-d) 22%, transparent));
  transform: rotate(var(--twh-front-rotation)) scale(var(--twh-front-scale));
  animation-name: none;
  animation-duration: var(--twh-light-speed);
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
  transition:
    opacity var(--twh-transition-duration) var(--twh-transition-easing),
    filter var(--twh-transition-duration) var(--twh-transition-easing);
}

.twh-halo__core {
  z-index: 4;
  background: var(--twh-core-gradient);
  opacity: calc(var(--twh-core-opacity) * var(--twh-core-opacity-dynamic));
  filter: blur(calc(var(--twh-ring-thickness) * 0.024));
  transform: rotate(var(--twh-core-rotation)) scale(var(--twh-core-scale));
  animation-name: none;
  animation-duration: var(--twh-light-speed);
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
  transition:
    opacity var(--twh-transition-duration) var(--twh-transition-easing),
    filter var(--twh-transition-duration) var(--twh-transition-easing);
}

.twh-halo__glow,
.twh-large-halo__glow,
.twh-mini-halo__glow {
  z-index: 0;
  background: var(--twh-glow-gradient);
  opacity: calc(var(--twh-glow-opacity) * .34 * var(--twh-glow-opacity-dynamic));
  transform: scale(calc(var(--twh-glow-scale) * var(--twh-glow-dynamic-scale))) rotate(var(--twh-glow-rotation));
  filter: blur(var(--twh-glow-blur));
  animation-name: none;
  animation-duration: var(--twh-speed);
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
  transition:
    opacity var(--twh-transition-duration) var(--twh-transition-easing),
    filter var(--twh-transition-duration) var(--twh-transition-easing);
}

.twh-large-halo[data-halo-presentation="large"] .twh-halo__tail {
  transform: rotate(var(--twh-tail-rotation)) scale(var(--twh-composite-scale));
}

.twh-large-halo[data-halo-presentation="large"] .twh-halo__front,
.twh-large-halo[data-halo-presentation="large"] .twh-large-halo__light {
  transform: rotate(var(--twh-front-rotation)) scale(var(--twh-composite-scale));
}

.twh-large-halo[data-halo-presentation="large"] .twh-halo__core {
  transform: rotate(var(--twh-core-rotation)) scale(var(--twh-composite-scale));
}

.twh-large-halo[data-halo-presentation="large"] .twh-halo__glow,
.twh-large-halo[data-halo-presentation="large"] .twh-large-halo__glow {
  transform: rotate(var(--twh-glow-rotation)) scale(var(--twh-composite-scale));
}

.twh-mini-halo[data-halo-presentation="mini"] .twh-halo__base,
.twh-mini-halo[data-halo-presentation="mini"] .twh-mini-halo__ring {
  transform: rotate(var(--twh-phase-rotation)) scale(var(--twh-composite-scale));
  transform-origin: 50% 50%;
}

.twh-mini-halo[data-halo-presentation="mini"] .twh-halo__tail {
  transform: rotate(var(--twh-tail-rotation)) scale(var(--twh-composite-scale));
}

.twh-mini-halo[data-halo-presentation="mini"] .twh-halo__front,
.twh-mini-halo[data-halo-presentation="mini"] .twh-mini-halo__light {
  transform: rotate(var(--twh-front-rotation)) scale(var(--twh-composite-scale));
}

.twh-mini-halo[data-halo-presentation="mini"] .twh-halo__core {
  transform: rotate(var(--twh-core-rotation)) scale(var(--twh-composite-scale));
}

.twh-mini-halo[data-halo-presentation="mini"] .twh-halo__glow,
.twh-mini-halo[data-halo-presentation="mini"] .twh-mini-halo__glow {
  transform: rotate(var(--twh-glow-rotation)) scale(var(--twh-composite-scale));
}

.twh-halo__layer::before,
.twh-halo__ring::before,
.twh-halo__light::before,
.twh-halo__glow::before,
.twh-large-halo__ring::before,
.twh-large-halo__light::before,
.twh-large-halo__glow::before,
.twh-mini-halo__ring::before,
.twh-mini-halo__light::before,
.twh-mini-halo__glow::before {
  position: absolute;
  inset: 0;
  border-radius: inherit;
  opacity: 0;
  pointer-events: none;
}

.twh-halo[data-halo-transitioning="true"] .twh-halo__layer::before,
.twh-large-halo[data-halo-transitioning="true"] .twh-halo__layer::before,
.twh-mini-halo[data-halo-transitioning="true"] .twh-halo__layer::before {
  content: "";
  animation: twhHaloPreviousLayerFade var(--twh-transition-duration) var(--twh-transition-easing) both;
}

.twh-halo[data-halo-transitioning="true"] .twh-halo__base::before,
.twh-large-halo[data-halo-transitioning="true"] .twh-halo__base::before,
.twh-mini-halo[data-halo-transitioning="true"] .twh-halo__base::before {
  --twh-prev-layer-opacity: var(--twh-prev-base-opacity);
  background: var(--twh-prev-base-gradient);
  opacity: var(--twh-prev-base-opacity);
}

.twh-halo[data-halo-transitioning="true"] .twh-halo__tail::before,
.twh-large-halo[data-halo-transitioning="true"] .twh-halo__tail::before,
.twh-mini-halo[data-halo-transitioning="true"] .twh-halo__tail::before {
  --twh-prev-layer-opacity: var(--twh-prev-tail-opacity);
  background: var(--twh-prev-tail-gradient);
  opacity: var(--twh-prev-tail-opacity);
}

.twh-halo[data-halo-transitioning="true"] .twh-halo__front::before,
.twh-large-halo[data-halo-transitioning="true"] .twh-halo__front::before,
.twh-mini-halo[data-halo-transitioning="true"] .twh-halo__front::before {
  --twh-prev-layer-opacity: var(--twh-prev-front-opacity);
  background: var(--twh-prev-front-gradient);
  opacity: var(--twh-prev-front-opacity);
}

.twh-halo[data-halo-transitioning="true"] .twh-halo__core::before,
.twh-large-halo[data-halo-transitioning="true"] .twh-halo__core::before,
.twh-mini-halo[data-halo-transitioning="true"] .twh-halo__core::before {
  --twh-prev-layer-opacity: var(--twh-prev-core-opacity);
  background: var(--twh-prev-core-gradient);
  opacity: var(--twh-prev-core-opacity);
}

.twh-halo[data-halo-transitioning="true"] .twh-halo__glow::before,
.twh-large-halo[data-halo-transitioning="true"] .twh-halo__glow::before,
.twh-mini-halo[data-halo-transitioning="true"] .twh-halo__glow::before {
  --twh-prev-layer-opacity: calc(var(--twh-prev-glow-opacity) * .34);
  background: var(--twh-prev-glow-gradient);
  opacity: calc(var(--twh-prev-glow-opacity) * .34);
}

.twh-halo__description,
.twh-halo__live,
.twh-large-halo__description,
.twh-large-halo__live {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

.twh-halo[data-color-token="idle"],
.twh-large-halo[data-color-token="idle"],
.twh-mini-halo[data-color-token="idle"] {
  --twh-speed: 11800ms;
  --twh-light-speed: 11200ms;
  --twh-transition-duration: 760ms;
  --twh-motion-angle: 24deg;
  --twh-pulse-scale: 1.006;
  --twh-energy-scale: 1.004;
  --twh-breath-scale: 1.003;
  --twh-breath-opacity: 1.03;
  --twh-front-focus-scale: 1.006;
  --twh-a: #6a2dff;
  --twh-b: #244bff;
  --twh-c: #9a4dff;
  --twh-d: #ff3765;
  --twh-e: #52a6ff;
  --twh-f: #ff8c24;
  --twh-base-opacity: 0.76;
  --twh-tail-opacity: 0.58;
  --twh-front-opacity: 0.72;
  --twh-core-opacity: 0.58;
  --twh-glow-opacity: 0.28;
}

.twh-halo[data-color-token="listening"],
.twh-large-halo[data-color-token="listening"],
.twh-mini-halo[data-color-token="listening"] {
  --twh-speed: 5200ms;
  --twh-light-speed: 3900ms;
  --twh-transition-duration: 720ms;
  --twh-motion-angle: 48deg;
  --twh-pulse-scale: 1.018;
  --twh-energy-scale: 1.018;
  --twh-breath-scale: 1.014;
  --twh-breath-opacity: 1.09;
  --twh-front-focus-scale: 1.02;
  --twh-a: #2148ff;
  --twh-b: #004bff;
  --twh-c: #28ccff;
  --twh-d: #1edbff;
  --twh-e: #7eeaff;
  --twh-f: #55b9ff;
  --twh-base-opacity: 0.82;
  --twh-tail-opacity: 0.74;
  --twh-front-opacity: 0.98;
  --twh-core-opacity: 0.86;
  --twh-glow-opacity: 0.36;
}

.twh-halo[data-color-token="understanding"],
.twh-large-halo[data-color-token="understanding"],
.twh-mini-halo[data-color-token="understanding"] {
  --twh-speed: 6800ms;
  --twh-light-speed: 5600ms;
  --twh-transition-duration: 780ms;
  --twh-motion-angle: 32deg;
  --twh-pulse-scale: 1.014;
  --twh-energy-scale: 1.024;
  --twh-breath-scale: 1.008;
  --twh-breath-opacity: 1.055;
  --twh-front-focus-scale: 1.026;
  --twh-a: #6330ff;
  --twh-b: #8b36ff;
  --twh-c: #c53dff;
  --twh-d: #ff2f8d;
  --twh-e: #ff4bb7;
  --twh-f: #7b54ff;
  --twh-base-opacity: 0.82;
  --twh-tail-opacity: 0.68;
  --twh-front-opacity: 0.92;
  --twh-core-opacity: 0.8;
  --twh-glow-opacity: 0.32;
}

.twh-halo[data-color-token="thinking"],
.twh-large-halo[data-color-token="thinking"],
.twh-mini-halo[data-color-token="thinking"] {
  --twh-speed: 7600ms;
  --twh-light-speed: 6200ms;
  --twh-transition-duration: 820ms;
  --twh-motion-angle: 76deg;
  --twh-pulse-scale: 1.016;
  --twh-energy-scale: 1.032;
  --twh-breath-scale: 1.012;
  --twh-breath-opacity: 1.075;
  --twh-front-focus-scale: 1.034;
  --twh-a: #5f35ff;
  --twh-b: #2d4dff;
  --twh-c: #d63bff;
  --twh-d: #ff365e;
  --twh-e: #ff8a1a;
  --twh-f: #ffb12d;
  --twh-base-opacity: 0.84;
  --twh-tail-opacity: 0.72;
  --twh-front-opacity: 1;
  --twh-core-opacity: 0.88;
  --twh-glow-opacity: 0.38;
}

.twh-halo[data-color-token="responding"],
.twh-large-halo[data-color-token="responding"],
.twh-mini-halo[data-color-token="responding"] {
  --twh-speed: 4600ms;
  --twh-light-speed: 3800ms;
  --twh-transition-duration: 820ms;
  --twh-motion-angle: 94deg;
  --twh-pulse-scale: 1.012;
  --twh-energy-scale: 1.04;
  --twh-breath-scale: 1.016;
  --twh-breath-opacity: 1.09;
  --twh-front-focus-scale: 1.042;
  --twh-a: #8638ff;
  --twh-b: #bb33ff;
  --twh-c: #ff2bc2;
  --twh-d: #ff3f91;
  --twh-e: #ff7bdd;
  --twh-f: #a55bff;
  --twh-base-opacity: 0.82;
  --twh-tail-opacity: 0.64;
  --twh-front-opacity: 0.9;
  --twh-core-opacity: 0.78;
  --twh-glow-opacity: 0.32;
}

.twh-halo[data-color-token="success"],
.twh-large-halo[data-color-token="success"],
.twh-mini-halo[data-color-token="success"] {
  --twh-speed: 2200ms;
  --twh-light-speed: 2100ms;
  --twh-transition-duration: 900ms;
  --twh-motion-angle: 32deg;
  --twh-pulse-scale: 1.004;
  --twh-energy-scale: 1.018;
  --twh-breath-scale: 1.006;
  --twh-breath-opacity: 1.06;
  --twh-front-focus-scale: 1.018;
  --twh-a: #1d55ff;
  --twh-b: #2297ff;
  --twh-c: #26d7b8;
  --twh-d: #35dd74;
  --twh-e: #86f0b5;
  --twh-f: #33c97f;
  --twh-base-opacity: 0.82;
  --twh-tail-opacity: 0.56;
  --twh-front-opacity: 0.74;
  --twh-core-opacity: 0.62;
  --twh-glow-opacity: 0.28;
}

.twh-halo[data-color-token="error"],
.twh-large-halo[data-color-token="error"],
.twh-mini-halo[data-color-token="error"] {
  --twh-speed: 3200ms;
  --twh-light-speed: 2800ms;
  --twh-transition-duration: 640ms;
  --twh-motion-angle: 18deg;
  --twh-pulse-scale: 1.006;
  --twh-energy-scale: 1.012;
  --twh-breath-scale: 1.004;
  --twh-breath-opacity: 1.04;
  --twh-front-focus-scale: 1.012;
  --twh-a: #ff1f36;
  --twh-b: #ff354f;
  --twh-c: #ff5b64;
  --twh-d: #ff243d;
  --twh-e: #ff8a8a;
  --twh-f: #ff3e52;
  --twh-base-opacity: 0.8;
  --twh-tail-opacity: 0.46;
  --twh-front-opacity: 0.68;
  --twh-core-opacity: 0.52;
  --twh-glow-opacity: 0.3;
}

.twh-halo[data-color-token="disabled"],
.twh-large-halo[data-color-token="disabled"],
.twh-mini-halo[data-color-token="disabled"] {
  --twh-speed: 0ms;
  --twh-light-speed: 0ms;
  --twh-transition-duration: 560ms;
  --twh-motion-angle: 0deg;
  --twh-pulse-scale: 1;
  --twh-a: #c9cbd2;
  --twh-b: #777b86;
  --twh-c: #e3e4e8;
  --twh-d: #9fa3ad;
  --twh-e: #f0f1f4;
  --twh-f: #777b86;
  --twh-base-opacity: 0.72;
  --twh-tail-opacity: 0;
  --twh-front-opacity: 0;
  --twh-core-opacity: 0;
  --twh-glow-opacity: 0;
  filter: grayscale(.12);
}

.twh-halo[data-reduced-motion="true"],
.twh-large-halo[data-reduced-motion="true"],
.twh-mini-halo[data-reduced-motion="true"] {
  --twh-speed: 30000ms;
  --twh-light-speed: 32000ms;
  --twh-transition-duration: 900ms;
  --twh-motion-angle: 3deg;
  --twh-pulse-scale: 1.002;
  --twh-energy-scale: 1.003;
  --twh-breath-scale: 1.001;
  --twh-breath-opacity: 1.012;
  --twh-front-focus-scale: 1.003;
}

.twh-halo[data-motion-profile^="halo.idle.still"] .twh-halo__tail,
.twh-large-halo[data-motion-profile^="halo.idle.still"] .twh-halo__tail,
.twh-mini-halo[data-motion-profile^="halo.idle.still"] .twh-halo__tail {
  animation-name: twhHaloIdleTail;
}

.twh-halo[data-motion-profile^="halo.idle.still"] .twh-halo__front,
.twh-large-halo[data-motion-profile^="halo.idle.still"] .twh-halo__front,
.twh-mini-halo[data-motion-profile^="halo.idle.still"] .twh-halo__front {
  animation-name: twhHaloIdleFront;
}

.twh-halo[data-motion-profile^="halo.idle.still"] .twh-halo__core,
.twh-large-halo[data-motion-profile^="halo.idle.still"] .twh-halo__core,
.twh-mini-halo[data-motion-profile^="halo.idle.still"] .twh-halo__core {
  animation-name: twhHaloIdleCore;
}

.twh-halo[data-motion-profile^="halo.idle.still"] .twh-halo__glow,
.twh-large-halo[data-motion-profile^="halo.idle.still"] .twh-halo__glow,
.twh-mini-halo[data-motion-profile^="halo.idle.still"] .twh-halo__glow {
  animation-name: twhHaloIdleGlow;
}

.twh-halo[data-motion-profile^="halo.listening.alive"] .twh-halo__tail,
.twh-large-halo[data-motion-profile^="halo.listening.alive"] .twh-halo__tail,
.twh-mini-halo[data-motion-profile^="halo.listening.alive"] .twh-halo__tail {
  animation-name: twhHaloListeningTail;
}

.twh-halo[data-motion-profile^="halo.listening.alive"] .twh-halo__front,
.twh-large-halo[data-motion-profile^="halo.listening.alive"] .twh-halo__front,
.twh-mini-halo[data-motion-profile^="halo.listening.alive"] .twh-halo__front {
  animation-name: twhHaloListeningFront;
}

.twh-halo[data-motion-profile^="halo.listening.alive"] .twh-halo__core,
.twh-large-halo[data-motion-profile^="halo.listening.alive"] .twh-halo__core,
.twh-mini-halo[data-motion-profile^="halo.listening.alive"] .twh-halo__core {
  animation-name: twhHaloListeningCore;
}

.twh-halo[data-motion-profile^="halo.listening.alive"] .twh-halo__glow,
.twh-large-halo[data-motion-profile^="halo.listening.alive"] .twh-halo__glow,
.twh-mini-halo[data-motion-profile^="halo.listening.alive"] .twh-halo__glow {
  animation-name: twhHaloListeningGlow;
}

.twh-halo[data-motion-profile^="halo.understanding.focus"] .twh-halo__tail,
.twh-large-halo[data-motion-profile^="halo.understanding.focus"] .twh-halo__tail,
.twh-mini-halo[data-motion-profile^="halo.understanding.focus"] .twh-halo__tail {
  animation-name: twhHaloUnderstandingTail;
}

.twh-halo[data-motion-profile^="halo.understanding.focus"] .twh-halo__front,
.twh-large-halo[data-motion-profile^="halo.understanding.focus"] .twh-halo__front,
.twh-mini-halo[data-motion-profile^="halo.understanding.focus"] .twh-halo__front {
  animation-name: twhHaloUnderstandingFront;
}

.twh-halo[data-motion-profile^="halo.understanding.focus"] .twh-halo__core,
.twh-large-halo[data-motion-profile^="halo.understanding.focus"] .twh-halo__core,
.twh-mini-halo[data-motion-profile^="halo.understanding.focus"] .twh-halo__core {
  animation-name: twhHaloUnderstandingCore;
}

.twh-halo[data-motion-profile^="halo.understanding.focus"] .twh-halo__glow,
.twh-large-halo[data-motion-profile^="halo.understanding.focus"] .twh-halo__glow,
.twh-mini-halo[data-motion-profile^="halo.understanding.focus"] .twh-halo__glow {
  animation-name: twhHaloUnderstandingGlow;
}

.twh-halo[data-motion-profile^="halo.thinking.steady"] .twh-halo__tail,
.twh-large-halo[data-motion-profile^="halo.thinking.steady"] .twh-halo__tail,
.twh-mini-halo[data-motion-profile^="halo.thinking.steady"] .twh-halo__tail {
  animation-name: twhHaloThinkingTail;
}

.twh-halo[data-motion-profile^="halo.thinking.steady"] .twh-halo__front,
.twh-large-halo[data-motion-profile^="halo.thinking.steady"] .twh-halo__front,
.twh-mini-halo[data-motion-profile^="halo.thinking.steady"] .twh-halo__front {
  animation-name: twhHaloThinkingFront;
}

.twh-halo[data-motion-profile^="halo.thinking.steady"] .twh-halo__core,
.twh-large-halo[data-motion-profile^="halo.thinking.steady"] .twh-halo__core,
.twh-mini-halo[data-motion-profile^="halo.thinking.steady"] .twh-halo__core {
  animation-name: twhHaloThinkingCore;
}

.twh-halo[data-motion-profile^="halo.thinking.steady"] .twh-halo__glow,
.twh-large-halo[data-motion-profile^="halo.thinking.steady"] .twh-halo__glow,
.twh-mini-halo[data-motion-profile^="halo.thinking.steady"] .twh-halo__glow {
  animation-name: twhHaloThinkingGlow;
}

.twh-halo[data-motion-profile^="halo.result.responding"] .twh-halo__tail,
.twh-large-halo[data-motion-profile^="halo.result.responding"] .twh-halo__tail,
.twh-mini-halo[data-motion-profile^="halo.result.responding"] .twh-halo__tail {
  animation-name: twhHaloRespondingTail;
}

.twh-halo[data-motion-profile^="halo.result.responding"] .twh-halo__front,
.twh-large-halo[data-motion-profile^="halo.result.responding"] .twh-halo__front,
.twh-mini-halo[data-motion-profile^="halo.result.responding"] .twh-halo__front {
  animation-name: twhHaloRespondingFront;
}

.twh-halo[data-motion-profile^="halo.result.responding"] .twh-halo__core,
.twh-large-halo[data-motion-profile^="halo.result.responding"] .twh-halo__core,
.twh-mini-halo[data-motion-profile^="halo.result.responding"] .twh-halo__core {
  animation-name: twhHaloRespondingCore;
}

.twh-halo[data-motion-profile^="halo.result.responding"] .twh-halo__glow,
.twh-large-halo[data-motion-profile^="halo.result.responding"] .twh-halo__glow,
.twh-mini-halo[data-motion-profile^="halo.result.responding"] .twh-halo__glow {
  animation-name: twhHaloRespondingGlow;
}

.twh-halo[data-motion-profile^="halo.idle.still"] .twh-halo__tail,
.twh-halo[data-motion-profile^="halo.idle.still"] .twh-halo__front,
.twh-halo[data-motion-profile^="halo.idle.still"] .twh-halo__core,
.twh-halo[data-motion-profile^="halo.idle.still"] .twh-halo__glow,
.twh-halo[data-motion-profile^="halo.listening.alive"] .twh-halo__tail,
.twh-halo[data-motion-profile^="halo.listening.alive"] .twh-halo__front,
.twh-halo[data-motion-profile^="halo.listening.alive"] .twh-halo__core,
.twh-halo[data-motion-profile^="halo.listening.alive"] .twh-halo__glow,
.twh-halo[data-motion-profile^="halo.understanding.focus"] .twh-halo__tail,
.twh-halo[data-motion-profile^="halo.understanding.focus"] .twh-halo__front,
.twh-halo[data-motion-profile^="halo.understanding.focus"] .twh-halo__core,
.twh-halo[data-motion-profile^="halo.understanding.focus"] .twh-halo__glow,
.twh-halo[data-motion-profile^="halo.thinking.steady"] .twh-halo__tail,
.twh-halo[data-motion-profile^="halo.thinking.steady"] .twh-halo__front,
.twh-halo[data-motion-profile^="halo.thinking.steady"] .twh-halo__core,
.twh-halo[data-motion-profile^="halo.thinking.steady"] .twh-halo__glow,
.twh-halo[data-motion-profile^="halo.result.responding"] .twh-halo__tail,
.twh-halo[data-motion-profile^="halo.result.responding"] .twh-halo__front,
.twh-halo[data-motion-profile^="halo.result.responding"] .twh-halo__core,
.twh-halo[data-motion-profile^="halo.result.responding"] .twh-halo__glow {
  animation-name: none;
}

.twh-halo[data-motion-profile^="halo.success.settle"] .twh-halo__tail,
.twh-large-halo[data-motion-profile^="halo.success.settle"] .twh-halo__tail,
.twh-mini-halo[data-motion-profile^="halo.success.settle"] .twh-halo__tail {
  animation-name: twhHaloSuccessTail;
}

.twh-halo[data-motion-profile^="halo.success.settle"] .twh-halo__front,
.twh-large-halo[data-motion-profile^="halo.success.settle"] .twh-halo__front,
.twh-mini-halo[data-motion-profile^="halo.success.settle"] .twh-halo__front {
  animation-name: twhHaloSuccessFront;
}

.twh-halo[data-motion-profile^="halo.success.settle"] .twh-halo__core,
.twh-large-halo[data-motion-profile^="halo.success.settle"] .twh-halo__core,
.twh-mini-halo[data-motion-profile^="halo.success.settle"] .twh-halo__core {
  animation-name: twhHaloSuccessCore;
}

.twh-halo[data-motion-profile^="halo.success.settle"] .twh-halo__glow,
.twh-large-halo[data-motion-profile^="halo.success.settle"] .twh-halo__glow,
.twh-mini-halo[data-motion-profile^="halo.success.settle"] .twh-halo__glow {
  animation-name: twhHaloSuccessGlow;
}

.twh-halo[data-motion-profile^="halo.error.restrained"] .twh-halo__tail,
.twh-large-halo[data-motion-profile^="halo.error.restrained"] .twh-halo__tail,
.twh-mini-halo[data-motion-profile^="halo.error.restrained"] .twh-halo__tail {
  animation-name: twhHaloErrorTail;
}

.twh-halo[data-motion-profile^="halo.error.restrained"] .twh-halo__front,
.twh-large-halo[data-motion-profile^="halo.error.restrained"] .twh-halo__front,
.twh-mini-halo[data-motion-profile^="halo.error.restrained"] .twh-halo__front {
  animation-name: twhHaloErrorFront;
}

.twh-halo[data-motion-profile^="halo.error.restrained"] .twh-halo__core,
.twh-large-halo[data-motion-profile^="halo.error.restrained"] .twh-halo__core,
.twh-mini-halo[data-motion-profile^="halo.error.restrained"] .twh-halo__core {
  animation-name: twhHaloErrorCore;
}

.twh-halo[data-motion-profile^="halo.error.restrained"] .twh-halo__glow,
.twh-large-halo[data-motion-profile^="halo.error.restrained"] .twh-halo__glow,
.twh-mini-halo[data-motion-profile^="halo.error.restrained"] .twh-halo__glow {
  animation-name: twhHaloErrorGlow;
}

.twh-large-halo[data-halo-presentation="large"] .twh-halo__tail,
.twh-large-halo[data-halo-presentation="large"] .twh-halo__front,
.twh-large-halo[data-halo-presentation="large"] .twh-halo__core,
.twh-large-halo[data-halo-presentation="large"] .twh-halo__glow {
  animation-name: none !important;
}

.twh-mini-halo[data-halo-presentation="mini"] .twh-halo__tail,
.twh-mini-halo[data-halo-presentation="mini"] .twh-halo__front,
.twh-mini-halo[data-halo-presentation="mini"] .twh-halo__core,
.twh-mini-halo[data-halo-presentation="mini"] .twh-halo__glow {
  animation-name: none !important;
}
}

.twh-halo[data-halo-paused="true"] .twh-halo__tail,
.twh-halo[data-halo-paused="true"] .twh-halo__front,
.twh-halo[data-halo-paused="true"] .twh-halo__core,
.twh-halo[data-halo-paused="true"] .twh-halo__glow,
.twh-large-halo[data-halo-paused="true"] .twh-halo__tail,
.twh-large-halo[data-halo-paused="true"] .twh-halo__front,
.twh-large-halo[data-halo-paused="true"] .twh-halo__core,
.twh-large-halo[data-halo-paused="true"] .twh-halo__glow,
.twh-mini-halo[data-halo-paused="true"] .twh-halo__tail,
.twh-mini-halo[data-halo-paused="true"] .twh-halo__front,
.twh-mini-halo[data-halo-paused="true"] .twh-halo__core,
.twh-mini-halo[data-halo-paused="true"] .twh-halo__glow,
.twh-halo[data-color-token="disabled"] .twh-halo__tail,
.twh-halo[data-color-token="disabled"] .twh-halo__front,
.twh-halo[data-color-token="disabled"] .twh-halo__core,
.twh-halo[data-color-token="disabled"] .twh-halo__glow,
.twh-large-halo[data-color-token="disabled"] .twh-halo__tail,
.twh-large-halo[data-color-token="disabled"] .twh-halo__front,
.twh-large-halo[data-color-token="disabled"] .twh-halo__core,
.twh-large-halo[data-color-token="disabled"] .twh-halo__glow,
.twh-mini-halo[data-color-token="disabled"] .twh-halo__tail,
.twh-mini-halo[data-color-token="disabled"] .twh-halo__front,
.twh-mini-halo[data-color-token="disabled"] .twh-halo__core,
.twh-mini-halo[data-color-token="disabled"] .twh-halo__glow {
  animation-play-state: paused;
}

.twh-halo[data-color-token="success"] .twh-halo__tail,
.twh-halo[data-color-token="success"] .twh-halo__front,
.twh-halo[data-color-token="success"] .twh-halo__core,
.twh-halo[data-color-token="success"] .twh-halo__glow,
.twh-large-halo[data-color-token="success"] .twh-halo__tail,
.twh-large-halo[data-color-token="success"] .twh-halo__front,
.twh-large-halo[data-color-token="success"] .twh-halo__core,
.twh-large-halo[data-color-token="success"] .twh-halo__glow,
.twh-mini-halo[data-color-token="success"] .twh-halo__tail,
.twh-mini-halo[data-color-token="success"] .twh-halo__front,
.twh-mini-halo[data-color-token="success"] .twh-halo__core,
.twh-mini-halo[data-color-token="success"] .twh-halo__glow,
.twh-halo[data-color-token="error"] .twh-halo__tail,
.twh-halo[data-color-token="error"] .twh-halo__front,
.twh-halo[data-color-token="error"] .twh-halo__core,
.twh-halo[data-color-token="error"] .twh-halo__glow,
.twh-large-halo[data-color-token="error"] .twh-halo__tail,
.twh-large-halo[data-color-token="error"] .twh-halo__front,
.twh-large-halo[data-color-token="error"] .twh-halo__core,
.twh-large-halo[data-color-token="error"] .twh-halo__glow,
.twh-mini-halo[data-color-token="error"] .twh-halo__tail,
.twh-mini-halo[data-color-token="error"] .twh-halo__front,
.twh-mini-halo[data-color-token="error"] .twh-halo__core,
.twh-mini-halo[data-color-token="error"] .twh-halo__glow {
  animation-iteration-count: 1;
  animation-fill-mode: both;
}

.twh-halo[data-color-token="disabled"] .twh-halo__tail,
.twh-halo[data-color-token="disabled"] .twh-halo__front,
.twh-halo[data-color-token="disabled"] .twh-halo__core,
.twh-halo[data-color-token="disabled"] .twh-halo__glow,
.twh-large-halo[data-color-token="disabled"] .twh-halo__tail,
.twh-large-halo[data-color-token="disabled"] .twh-halo__front,
.twh-large-halo[data-color-token="disabled"] .twh-halo__core,
.twh-large-halo[data-color-token="disabled"] .twh-halo__glow,
.twh-mini-halo[data-color-token="disabled"] .twh-halo__tail,
.twh-mini-halo[data-color-token="disabled"] .twh-halo__front,
.twh-mini-halo[data-color-token="disabled"] .twh-halo__core,
.twh-mini-halo[data-color-token="disabled"] .twh-halo__glow {
  animation: none;
}

@keyframes twhHaloPreviousLayerFade {
  0% {
    opacity: var(--twh-prev-layer-opacity, 1);
  }

  100% {
    opacity: 0;
  }
}

@keyframes twhHaloIdleTail {
  0% { transform: rotate(0deg) scale(1); opacity: calc(var(--twh-tail-opacity) * .96); }
  52% { transform: rotate(calc(var(--twh-motion-angle) * .54)) scale(var(--twh-energy-scale)); opacity: var(--twh-tail-opacity); }
  100% { transform: rotate(var(--twh-motion-angle)) scale(1); opacity: calc(var(--twh-tail-opacity) * .98); }
}

@keyframes twhHaloIdleFront {
  0% { transform: rotate(0deg) scale(1); opacity: calc(var(--twh-front-opacity) * .98); }
  54% { transform: rotate(calc(var(--twh-motion-angle) * .52)) scale(var(--twh-front-focus-scale)); opacity: var(--twh-front-opacity); }
  100% { transform: rotate(var(--twh-motion-angle)) scale(1); opacity: calc(var(--twh-front-opacity) * .99); }
}

@keyframes twhHaloIdleCore {
  0% { transform: rotate(calc(var(--twh-motion-angle) * -.08)) scale(1); opacity: var(--twh-core-opacity); }
  100% { transform: rotate(calc(var(--twh-motion-angle) * .82)) scale(var(--twh-breath-scale)); opacity: calc(var(--twh-core-opacity) * var(--twh-breath-opacity)); }
}

@keyframes twhHaloIdleGlow {
  0% { transform: scale(var(--twh-glow-scale)) rotate(0deg); opacity: calc(var(--twh-glow-opacity) * .28); }
  50% { transform: scale(calc(var(--twh-glow-scale) * var(--twh-breath-scale))) rotate(calc(var(--twh-motion-angle) * .48)); opacity: calc(var(--twh-glow-opacity) * .34); }
  100% { transform: scale(var(--twh-glow-scale)) rotate(var(--twh-motion-angle)); opacity: calc(var(--twh-glow-opacity) * .3); }
}

@keyframes twhHaloListeningTail {
  0% { transform: rotate(0deg) scale(1); opacity: calc(var(--twh-tail-opacity) * .9); }
  38% { transform: rotate(calc(var(--twh-motion-angle) * .32)) scale(var(--twh-breath-scale)); opacity: calc(var(--twh-tail-opacity) * var(--twh-breath-opacity)); }
  70% { transform: rotate(calc(var(--twh-motion-angle) * .7)) scale(var(--twh-energy-scale)); opacity: var(--twh-tail-opacity); }
  100% { transform: rotate(var(--twh-motion-angle)) scale(1); opacity: calc(var(--twh-tail-opacity) * .94); }
}

@keyframes twhHaloListeningFront {
  0% { transform: rotate(0deg) scale(1); opacity: calc(var(--twh-front-opacity) * .9); }
  44% { transform: rotate(calc(var(--twh-motion-angle) * .42)) scale(var(--twh-breath-scale)); opacity: calc(var(--twh-front-opacity) * var(--twh-breath-opacity)); }
  72% { transform: rotate(calc(var(--twh-motion-angle) * .76)) scale(var(--twh-front-focus-scale)); opacity: var(--twh-front-opacity); }
  100% { transform: rotate(var(--twh-motion-angle)) scale(1); opacity: calc(var(--twh-front-opacity) * .94); }
}

@keyframes twhHaloListeningCore {
  0% { transform: rotate(0deg) scale(1); opacity: calc(var(--twh-core-opacity) * .86); }
  50% { transform: rotate(calc(var(--twh-motion-angle) * .48)) scale(var(--twh-breath-scale)); opacity: calc(var(--twh-core-opacity) * var(--twh-breath-opacity)); }
  100% { transform: rotate(var(--twh-motion-angle)) scale(1); opacity: calc(var(--twh-core-opacity) * .9); }
}

@keyframes twhHaloListeningGlow {
  0% { transform: scale(var(--twh-glow-scale)) rotate(0deg); opacity: calc(var(--twh-glow-opacity) * .24); }
  48% { transform: scale(calc(var(--twh-glow-scale) * var(--twh-breath-scale))) rotate(calc(var(--twh-motion-angle) * .44)); opacity: calc(var(--twh-glow-opacity) * .42); }
  100% { transform: scale(var(--twh-glow-scale)) rotate(var(--twh-motion-angle)); opacity: calc(var(--twh-glow-opacity) * .28); }
}

@keyframes twhHaloUnderstandingTail {
  0% { transform: rotate(0deg) scale(var(--twh-breath-scale)); opacity: calc(var(--twh-tail-opacity) * .94); }
  58% { transform: rotate(calc(var(--twh-motion-angle) * .45)) scale(var(--twh-energy-scale)); opacity: calc(var(--twh-tail-opacity) * var(--twh-breath-opacity)); }
  100% { transform: rotate(var(--twh-motion-angle)) scale(var(--twh-front-focus-scale)); opacity: var(--twh-tail-opacity); }
}

@keyframes twhHaloUnderstandingFront {
  0% { transform: rotate(0deg) scale(1); opacity: calc(var(--twh-front-opacity) * .9); }
  64% { transform: rotate(calc(var(--twh-motion-angle) * .54)) scale(var(--twh-energy-scale)); opacity: calc(var(--twh-front-opacity) * var(--twh-breath-opacity)); }
  100% { transform: rotate(var(--twh-motion-angle)) scale(var(--twh-front-focus-scale)); opacity: var(--twh-front-opacity); }
}

@keyframes twhHaloUnderstandingCore {
  0% { transform: rotate(calc(var(--twh-motion-angle) * -.05)) scale(1); opacity: calc(var(--twh-core-opacity) * .88); }
  55% { transform: rotate(calc(var(--twh-motion-angle) * .36)) scale(var(--twh-front-focus-scale)); opacity: calc(var(--twh-core-opacity) * var(--twh-breath-opacity)); }
  100% { transform: rotate(calc(var(--twh-motion-angle) * .9)) scale(var(--twh-energy-scale)); opacity: var(--twh-core-opacity); }
}

@keyframes twhHaloUnderstandingGlow {
  0% { transform: scale(var(--twh-glow-scale)) rotate(0deg); opacity: calc(var(--twh-glow-opacity) * .24); }
  100% { transform: scale(calc(var(--twh-glow-scale) * var(--twh-breath-scale))) rotate(var(--twh-motion-angle)); opacity: calc(var(--twh-glow-opacity) * .34); }
}

@keyframes twhHaloThinkingTail {
  0% { transform: rotate(0deg) scale(1); opacity: calc(var(--twh-tail-opacity) * .86); }
  34% { transform: rotate(calc(var(--twh-motion-angle) * .42)) scale(var(--twh-energy-scale)); opacity: calc(var(--twh-tail-opacity) * var(--twh-breath-opacity)); }
  68% { transform: rotate(calc(var(--twh-motion-angle) * .76)) scale(var(--twh-front-focus-scale)); opacity: calc(var(--twh-tail-opacity) * .94); }
  100% { transform: rotate(var(--twh-motion-angle)) scale(1); opacity: var(--twh-tail-opacity); }
}

@keyframes twhHaloThinkingFront {
  0% { transform: rotate(0deg) scale(1); opacity: calc(var(--twh-front-opacity) * .9); }
  30% { transform: rotate(calc(var(--twh-motion-angle) * .38)) scale(var(--twh-front-focus-scale)); opacity: calc(var(--twh-front-opacity) * var(--twh-breath-opacity)); }
  62% { transform: rotate(calc(var(--twh-motion-angle) * .72)) scale(var(--twh-energy-scale)); opacity: calc(var(--twh-front-opacity) * .95); }
  100% { transform: rotate(var(--twh-motion-angle)) scale(1); opacity: var(--twh-front-opacity); }
}

@keyframes twhHaloThinkingCore {
  0% { transform: rotate(0deg) scale(1); opacity: calc(var(--twh-core-opacity) * .84); }
  45% { transform: rotate(calc(var(--twh-motion-angle) * .5)) scale(var(--twh-energy-scale)); opacity: calc(var(--twh-core-opacity) * var(--twh-breath-opacity)); }
  100% { transform: rotate(var(--twh-motion-angle)) scale(var(--twh-front-focus-scale)); opacity: var(--twh-core-opacity); }
}

@keyframes twhHaloThinkingGlow {
  0% { transform: scale(var(--twh-glow-scale)) rotate(0deg); opacity: calc(var(--twh-glow-opacity) * .24); }
  44% { transform: scale(calc(var(--twh-glow-scale) * var(--twh-breath-scale))) rotate(calc(var(--twh-motion-angle) * .52)); opacity: calc(var(--twh-glow-opacity) * .4); }
  100% { transform: scale(var(--twh-glow-scale)) rotate(var(--twh-motion-angle)); opacity: calc(var(--twh-glow-opacity) * .3); }
}

@keyframes twhHaloRespondingTail {
  0% { transform: rotate(0deg) scale(var(--twh-front-focus-scale)); opacity: calc(var(--twh-tail-opacity) * .82); }
  42% { transform: rotate(calc(var(--twh-motion-angle) * .55)) scale(var(--twh-energy-scale)); opacity: calc(var(--twh-tail-opacity) * var(--twh-breath-opacity)); }
  100% { transform: rotate(var(--twh-motion-angle)) scale(1); opacity: calc(var(--twh-tail-opacity) * .9); }
}

@keyframes twhHaloRespondingFront {
  0% { transform: rotate(0deg) scale(var(--twh-front-focus-scale)); opacity: calc(var(--twh-front-opacity) * .92); }
  45% { transform: rotate(calc(var(--twh-motion-angle) * .58)) scale(var(--twh-energy-scale)); opacity: calc(var(--twh-front-opacity) * var(--twh-breath-opacity)); }
  72% { transform: rotate(calc(var(--twh-motion-angle) * .82)) scale(var(--twh-breath-scale)); opacity: var(--twh-front-opacity); }
  100% { transform: rotate(var(--twh-motion-angle)) scale(1); opacity: calc(var(--twh-front-opacity) * .92); }
}

@keyframes twhHaloRespondingCore {
  0% { transform: rotate(0deg) scale(1); opacity: calc(var(--twh-core-opacity) * .88); }
  52% { transform: rotate(calc(var(--twh-motion-angle) * .62)) scale(var(--twh-energy-scale)); opacity: calc(var(--twh-core-opacity) * var(--twh-breath-opacity)); }
  100% { transform: rotate(var(--twh-motion-angle)) scale(1); opacity: var(--twh-core-opacity); }
}

@keyframes twhHaloRespondingGlow {
  0% { transform: scale(var(--twh-glow-scale)) rotate(0deg); opacity: calc(var(--twh-glow-opacity) * .24); }
  46% { transform: scale(calc(var(--twh-glow-scale) * var(--twh-breath-scale))) rotate(calc(var(--twh-motion-angle) * .56)); opacity: calc(var(--twh-glow-opacity) * .44); }
  100% { transform: scale(var(--twh-glow-scale)) rotate(var(--twh-motion-angle)); opacity: calc(var(--twh-glow-opacity) * .3); }
}

@keyframes twhHaloSuccessTail {
  0% { transform: rotate(0deg) scale(.996); opacity: calc(var(--twh-tail-opacity) * .64); }
  42% { transform: rotate(calc(var(--twh-motion-angle) * .5)) scale(var(--twh-energy-scale)); opacity: calc(var(--twh-tail-opacity) * var(--twh-breath-opacity)); }
  100% { transform: rotate(var(--twh-motion-angle)) scale(1); opacity: calc(var(--twh-tail-opacity) * .7); }
}

@keyframes twhHaloSuccessFront {
  0% { transform: rotate(0deg) scale(.996); opacity: calc(var(--twh-front-opacity) * .64); }
  48% { transform: rotate(calc(var(--twh-motion-angle) * .62)) scale(var(--twh-energy-scale)); opacity: calc(var(--twh-front-opacity) * var(--twh-breath-opacity)); }
  100% { transform: rotate(var(--twh-motion-angle)) scale(1); opacity: calc(var(--twh-front-opacity) * .74); }
}

@keyframes twhHaloSuccessCore {
  0% { transform: rotate(0deg) scale(.998); opacity: calc(var(--twh-core-opacity) * .62); }
  50% { transform: rotate(calc(var(--twh-motion-angle) * .55)) scale(var(--twh-front-focus-scale)); opacity: var(--twh-core-opacity); }
  100% { transform: rotate(var(--twh-motion-angle)) scale(1); opacity: calc(var(--twh-core-opacity) * .7); }
}

@keyframes twhHaloSuccessGlow {
  0% { transform: scale(var(--twh-glow-scale)) rotate(0deg); opacity: calc(var(--twh-glow-opacity) * .14); }
  48% { transform: scale(calc(var(--twh-glow-scale) * var(--twh-breath-scale))) rotate(calc(var(--twh-motion-angle) * .6)); opacity: calc(var(--twh-glow-opacity) * .36); }
  100% { transform: scale(var(--twh-glow-scale)) rotate(var(--twh-motion-angle)); opacity: calc(var(--twh-glow-opacity) * .16); }
}

@keyframes twhHaloErrorTail {
  0% { transform: rotate(0deg) scale(1); opacity: calc(var(--twh-tail-opacity) * .56); }
  36% { transform: rotate(calc(var(--twh-motion-angle) * .38)) scale(1.02); opacity: calc(var(--twh-tail-opacity) * var(--twh-breath-opacity)); }
  100% { transform: rotate(var(--twh-motion-angle)) scale(1); opacity: calc(var(--twh-tail-opacity) * .72); }
}

@keyframes twhHaloErrorFront {
  0% { transform: rotate(0deg) scale(1); opacity: calc(var(--twh-front-opacity) * .52); }
  42% { transform: rotate(calc(var(--twh-motion-angle) * .44)) scale(1.022); opacity: calc(var(--twh-front-opacity) * var(--twh-breath-opacity)); }
  100% { transform: rotate(var(--twh-motion-angle)) scale(1); opacity: calc(var(--twh-front-opacity) * .72); }
}

@keyframes twhHaloErrorCore {
  0% { transform: rotate(0deg) scale(1); opacity: calc(var(--twh-core-opacity) * .5); }
  40% { transform: rotate(calc(var(--twh-motion-angle) * .42)) scale(1.018); opacity: calc(var(--twh-core-opacity) * var(--twh-breath-opacity)); }
  100% { transform: rotate(var(--twh-motion-angle)) scale(1); opacity: calc(var(--twh-core-opacity) * .62); }
}

@keyframes twhHaloErrorGlow {
  0% { transform: scale(var(--twh-glow-scale)) rotate(0deg); opacity: calc(var(--twh-glow-opacity) * .12); }
  38% { transform: scale(calc(var(--twh-glow-scale) * 1.018)) rotate(calc(var(--twh-motion-angle) * .4)); opacity: calc(var(--twh-glow-opacity) * .34); }
  100% { transform: scale(var(--twh-glow-scale)) rotate(var(--twh-motion-angle)); opacity: calc(var(--twh-glow-opacity) * .16); }
}

@media (prefers-reduced-motion: reduce) {
  .twh-halo,
  .twh-large-halo,
  .twh-mini-halo {
    --twh-speed: 32000ms;
    --twh-light-speed: 34000ms;
    --twh-motion-angle: 2deg;
    --twh-pulse-scale: 1;
    transition-duration: 1ms;
  }
}

@media (forced-colors: active) {
  .twh-halo,
  .twh-large-halo,
  .twh-mini-halo {
    --twh-ring-gradient: conic-gradient(from 214deg, ButtonText, Highlight, ButtonText);
    --twh-base-gradient: conic-gradient(from 214deg, ButtonText, Highlight, ButtonText);
    --twh-tail-gradient: conic-gradient(from 236deg, transparent, Highlight, transparent);
    --twh-front-gradient: conic-gradient(from 236deg, transparent, Highlight, transparent);
    --twh-core-gradient: conic-gradient(from 236deg, transparent, Highlight, transparent);
    forced-color-adjust: auto;
  }
}

@media (max-width: 360px) {
  .twh-halo--large,
  .twh-large-halo {
    --twh-size: 280px;
  }

  .twh-halo--mini,
  .twh-mini-halo {
    --twh-size: 24px;
  }
}
