@incodetech/web 2.3.2-rc.4 → 2.4.0-rc.0

package/dist/video-selfie/styles.css

@@ -1,865 +1,2 @@
 /*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */
-@layer properties {
-  @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-    .IncodeComponent, .IncodeComponent *, .IncodeComponent :before, .IncodeComponent :after, .IncodeComponent ::backdrop {
-      --tw-border-style: solid;
-      --tw-translate-x: 0;
-      --tw-translate-y: 0;
-      --tw-translate-z: 0;
-      --tw-rotate-x: initial;
-      --tw-rotate-y: initial;
-      --tw-rotate-z: initial;
-      --tw-skew-x: initial;
-      --tw-skew-y: initial;
-    }
-  }
-}
-
-@layer incode-theme, incode-utilities, incode-base, incode-components;
-
-@keyframes slideUp {
-  from {
-    transform: translateY(100%);
-  }
-
-  to {
-    transform: translateY(0);
-  }
-}
-
-@keyframes fadeIn {
-  from {
-    opacity: 0;
-  }
-
-  to {
-    opacity: 1;
-  }
-}
-
-@keyframes incodeToastFadeInOut {
-  0% {
-    opacity: 0;
-    transform: translate(-50%, -20px);
-  }
-
-  15% {
-    opacity: 1;
-    transform: translate(-50%);
-  }
-
-  85% {
-    opacity: 1;
-    transform: translate(-50%);
-  }
-
-  100% {
-    opacity: 0;
-    transform: translate(-50%, -20px);
-  }
-}
-
-.IncodeCaptureContainer {
-  flex-direction: column;
-  flex: 1;
-  justify-content: flex-start;
-  align-items: center;
-  width: 100%;
-  height: 100%;
-  display: flex;
-  position: relative;
-  overflow: hidden;
-}
-
-.IncodeCaptureContainer .IncodeCaptureFrame {
-  aspect-ratio: 1;
-  width: 100%;
-  max-width: var(--face-capture-frame-max-w);
-  border-radius: var(--radius-full, var(--border-radius-full));
-  border-style: var(--tw-border-style);
-  border-width: 12px;
-  border-color: #0000;
-  position: relative;
-}
-
-.IncodeCaptureContainer .IncodeCaptureVideoWrapper {
-  --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);
-  --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
-  width: calc(100% - 24px);
-  height: calc(100% - 24px);
-  translate: var(--tw-translate-x) var(--tw-translate-y);
-  transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, );
-  border-radius: var(--radius-full, var(--border-radius-full));
-  background-color: var(--color-surface-neutral-100-static, var(--surface-neutral-100-static));
-  justify-content: center;
-  align-items: center;
-  display: flex;
-  position: absolute;
-  top: 50%;
-  left: 50%;
-  overflow: hidden;
-}
-
-.IncodeCaptureContainer .IncodeCaptureVideo {
-  z-index: 50;
-  width: 100%;
-  height: 100%;
-  position: absolute;
-}
-
-.IncodeCaptureContainer .IncodeCaptureVideoElement {
-  inset: var(--spacing-0, var(--spacing-none, 0px));
-  object-fit: cover;
-  width: 100%;
-  height: 100%;
-  position: absolute;
-}
-
-.IncodeCaptureContainer .IncodeCaptureVideoElement.IncodeMediaCoverPending {
-  opacity: 0;
-}
-
-.IncodeCaptureContainer .IncodeCaptureVideoElement.IncodeCaptureVideoMirrored {
-  transform: scaleX(-1);
-}
-
-.IncodeCaptureContainer .IncodeCaptureAvatarHost {
-  width: 100%;
-  height: 100%;
-  position: absolute;
-}
-
-.IncodeCaptureContainer .IncodeCaptureAvatarElement {
-  inset: var(--spacing-0, var(--spacing-none, 0px));
-  object-fit: cover;
-  width: 100%;
-  height: 100%;
-  position: absolute;
-}
-
-.IncodeCaptureContainer .IncodeCaptureAvatarElement.IncodeMediaCoverPending {
-  opacity: 0;
-}
-
-.IncodeCaptureContainer .IncodeCaptureAvatarElement.IncodeCaptureAvatarMirrored {
-  transform: scaleX(-1);
-}
-
-.IncodeCaptureVisuallyHidden {
-  clip-path: inset(50%);
-  white-space: nowrap;
-  border-width: 0;
-  width: 1px;
-  height: 1px;
-  margin: -1px;
-  padding: 0;
-  position: absolute;
-  overflow: hidden;
-}
-
-.IncodeFaceOutline {
-  width: 100%;
-  height: 100%;
-}
-
-.IncodeLoadingBorder {
-  aspect-ratio: 1;
-  width: 100%;
-  max-width: var(--face-capture-frame-max-w);
-  position: absolute;
-}
-
-.IncodeLoadingBorder .IncodeLoadingBorderBase, .IncodeLoadingBorder .IncodeLoadingBorderForeground {
-  inset: var(--spacing-0, var(--spacing-none, 0px));
-  position: absolute;
-}
-
-.IncodeLoadingBorder .IncodeLoadingBorderForeground.IncodeLoadingBorderSpinning {
-  animation: var(--animate-spin, spin 1s linear infinite);
-}
-
-.IncodeLoadingBorder .IncodeLoadingBorderPath {
-  transition: all 1s ease-in-out;
-}
-
-.IncodeNotification {
-  flex-direction: column;
-  align-items: center;
-  display: flex;
-}
-
-.IncodeNotification .IncodeNotificationText {
-  text-align: center;
-  font-family: var(--typography-feedback-family);
-  font-size: var(--typography-feedback-l-size);
-  font-weight: var(--typography-feedback-l-weight);
-  line-height: var(--typography-feedback-l-line-height);
-  letter-spacing: var(--typography-feedback-l-letter-spacing);
-  color: var(--color-text-body-primary, var(--text-body-800-primary));
-}
-
-.IncodeIdCaptureNotification {
-  top: var(--spacing-24, var(--spacing-24, 24px));
-  right: var(--spacing-24, var(--spacing-24, 24px));
-  left: var(--spacing-24, var(--spacing-24, 24px));
-  z-index: 100;
-  max-width: var(--incode-form-max-w);
-  padding-bottom: var(--spacing-32, var(--spacing-32, 32px));
-  align-items: flex-end;
-  margin: auto;
-  display: flex;
-  position: absolute;
-}
-
-.IncodeIdCaptureNotification .IncodeIdCaptureNotificationContent {
-  z-index: 100;
-  border-radius: var(--radius-large, var(--border-radius-large));
-  border-style: var(--tw-border-style);
-  border-width: 2px;
-  border-color: var(--color-border-neutral-300, var(--border-neutral-300));
-  background-color: var(--color-surface-neutral-900-80, var(--surface-neutral-900-80));
-  width: 100%;
-  padding-inline: var(--spacing-20, var(--spacing-20, 20px));
-  box-shadow: var(--id-capture-notification-content-shadow);
-  display: flex;
-  overflow: hidden;
-}
-
-.IncodeIdCaptureNotification .IncodeIdCaptureNotificationContent .IncodeIdCaptureNotificationText {
-  justify-content: center;
-  gap: var(--spacing-8, var(--spacing-8, 8px));
-  padding-top: var(--spacing-16, var(--spacing-16, 16px));
-  padding-bottom: var(--spacing-12, var(--spacing-12, 12px));
-  text-align: center;
-  color: var(--color-text-body-0-static, var(--text-body-0-static));
-  flex-direction: column;
-  display: flex;
-}
-
-.IncodeIdCaptureNotification .IncodeIdCaptureNotificationContent .IncodeIdCaptureNotificationText .IncodeIdCaptureNotificationTitle {
-  font-family: var(--typography-headline-family);
-  font-size: var(--typography-headline-h3-size);
-  font-weight: var(--typography-headline-h3-weight);
-  line-height: var(--typography-headline-h3-line-height);
-  letter-spacing: var(--typography-headline-h3-letter-spacing);
-}
-
-.IncodeIdCaptureNotification .IncodeIdCaptureNotificationContent .IncodeIdCaptureNotificationText .IncodeIdCaptureNotificationDescription {
-  font-family: var(--typography-headline-family);
-  font-size: var(--typography-headline-h5-size);
-  font-weight: var(--typography-headline-h5-weight);
-  line-height: var(--typography-headline-h5-line-height);
-  letter-spacing: var(--typography-headline-h5-letter-spacing);
-  color: var(--color-text-body-tertiary-static, var(--text-body-300-tertiary-static));
-}
-
-.IncodeIdCaptureNotification .IncodeIdCaptureNotificationContent .IncodeIdCaptureNotificationAnimation {
-  height: var(--id-capture-notification-animation-height);
-  justify-content: center;
-  align-items: center;
-  width: auto;
-  display: flex;
-}
-
-.IncodeVideoSelfieCapturePage {
-  background-color: var(--capture-page-backdrop-color);
-}
-
-.IncodeVideoSelfieCapturePage .IncodePageInner {
-  padding: var(--spacing-0, var(--spacing-none, 0px));
-}
-
-.IncodeVideoSelfieCapturePage .IncodePageContent {
-  flex: 1;
-  position: relative;
-}
-
-.IncodeVideoSelfieOverlay {
-  pointer-events: none;
-  inset: var(--spacing-0, var(--spacing-none, 0px));
-  z-index: 10;
-  flex-direction: column;
-  align-items: center;
-  display: flex;
-  position: absolute;
-  container-type: inline-size;
-}
-
-.IncodeVideoSelfieSwitchingCameraPage {
-  background-color: var(--color-surface-neutral-900-static, var(--surface-neutral-900-static));
-}
-
-.IncodeVideoSelfieSwitchingCameraPage .IncodePageInner {
-  padding: var(--spacing-0, var(--spacing-none, 0px));
-}
-
-.IncodeVideoSelfieSwitchingCameraPage .IncodePageContent {
-  flex: 1;
-  position: relative;
-}
-
-.IncodeVideoSelfieSwitchingCameraPage .IncodeVideoSelfieSwitchingCamera {
-  width: 100%;
-  height: 100%;
-  padding-inline: var(--spacing-24, var(--spacing-24, 24px));
-  flex-direction: column;
-  justify-content: center;
-  align-items: center;
-  display: flex;
-  position: relative;
-}
-
-.IncodeVideoSelfieSwitchingCameraPage .IncodeVideoSelfieSwitchingCameraContent {
-  align-items: center;
-  gap: var(--spacing-16, var(--spacing-16, 16px));
-  text-align: center;
-  flex-direction: column;
-  display: flex;
-}
-
-.IncodeVideoSelfieSwitchingCameraPage .IncodeVideoSelfieSwitchingCameraIcon {
-  width: var(--spacing-40, var(--spacing-40, 40px));
-  height: var(--spacing-40, var(--spacing-40, 40px));
-}
-
-.IncodeVideoSelfieSwitchingCameraPage .IncodeVideoSelfieSwitchingCameraTitle {
-  font-family: var(--typography-headline-family);
-  font-size: var(--typography-headline-h2-size);
-  font-weight: var(--typography-headline-h2-weight);
-  line-height: var(--typography-headline-h2-line-height);
-  letter-spacing: var(--typography-headline-h2-letter-spacing);
-  color: var(--color-text-body-0-static, var(--text-body-0-static));
-}
-
-.IncodeVideoSelfieTutorialPage .IncodePageContent {
-  min-height: var(--spacing-0, var(--spacing-none, 0px));
-}
-
-.IncodeVideoSelfieTutorialBody {
-  margin-top: var(--spacing-24, var(--spacing-24, 24px));
-  min-height: var(--spacing-0, var(--spacing-none, 0px));
-  flex: 1;
-  overflow-y: auto;
-}
-
-.IncodeVideoSelfieTutorialSteps {
-  width: 100%;
-  max-width: var(--incode-form-max-w);
-  gap: var(--spacing-8, var(--spacing-8, 8px));
-  flex-direction: column;
-  margin-inline: auto;
-  display: flex;
-}
-
-.IncodeVideoSelfieTutorialStep {
-  align-items: center;
-  gap: var(--spacing-12, var(--spacing-12, 12px));
-  display: flex;
-}
-
-.IncodeVideoSelfieTutorialStepIcon {
-  width: var(--spacing-40, var(--spacing-40, 40px));
-  height: var(--spacing-40, var(--spacing-40, 40px));
-  border-radius: var(--radius-small, var(--border-radius-small));
-  border-style: var(--tw-border-style);
-  border-width: 2px;
-  border-color: var(--color-border-neutral-100, var(--border-neutral-100));
-  background-color: var(--color-surface-neutral-0, var(--surface-neutral-0));
-  color: var(--color-text-body-secondary, var(--text-body-500-secondary));
-  flex-shrink: 0;
-  justify-content: center;
-  align-items: center;
-  display: flex;
-  position: relative;
-}
-
-.IncodeVideoSelfieTutorialStepIcon svg {
-  height: var(--spacing-24, var(--spacing-24, 24px));
-  width: var(--spacing-24, var(--spacing-24, 24px));
-}
-
-.IncodeVideoSelfieTutorialStep:not(:last-child) .IncodeVideoSelfieTutorialStepIcon:after {
-  content: "";
-  height: var(--spacing-8, var(--spacing-8, 8px));
-  width: var(--spacing-2, var(--spacing-2, 2px));
-  --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);
-  translate: var(--tw-translate-x) var(--tw-translate-y);
-  background-color: var(--color-border-neutral-100, var(--border-neutral-100));
-  position: absolute;
-  top: 100%;
-  left: 50%;
-}
-
-.IncodeVideoSelfieTutorialStepLabel {
-  text-align: left;
-  font-family: var(--typography-headline-family);
-  font-size: var(--typography-headline-h4-size);
-  font-weight: var(--typography-headline-h4-weight);
-  line-height: var(--typography-headline-h4-line-height);
-  letter-spacing: var(--typography-headline-h4-letter-spacing);
-  color: var(--color-text-body-secondary, var(--text-body-500-secondary));
-}
-
-.IncodeVideoSelfieTutorialActions {
-  bottom: var(--spacing-0, var(--spacing-none, 0px));
-  background-color: var(--color-surface-neutral-0, var(--surface-neutral-0));
-  width: 100%;
-  padding-top: var(--spacing-24, var(--spacing-24, 24px));
-  padding-bottom: var(--spacing-24, var(--spacing-24, 24px));
-  flex-shrink: 0;
-  display: flex;
-  position: sticky;
-}
-
-.IncodeVideoSelfieTutorialStartButton {
-  max-width: var(--incode-form-max-w);
-  margin: auto;
-}
-
-.IncodeVsStepsHeader {
-  inset-inline: var(--spacing-0, var(--spacing-none, 0px));
-  top: var(--spacing-0, var(--spacing-none, 0px));
-  gap: var(--spacing-2, var(--spacing-2, 2px));
-  width: 100%;
-  padding-inline: var(--spacing-24, var(--spacing-24, 24px));
-  padding-top: var(--spacing-24, var(--spacing-24, 24px));
-  color: var(--color-text-body-0-static, var(--text-body-0-static));
-  z-index: var(--video-selfie-chrome-z-index);
-  background-color: #0000;
-  list-style-type: none;
-  display: flex;
-  position: absolute;
-}
-
-.IncodeVsStepsHeader .IncodeVsStepsHeaderStep {
-  align-items: center;
-  gap: var(--spacing-8, var(--spacing-8, 8px));
-  width: 100%;
-  height: var(--video-selfie-stepper-height);
-  flex-direction: column;
-  flex: 1;
-  display: flex;
-  position: relative;
-}
-
-.IncodeVsStepsHeader .IncodeVsStepsHeaderStep img {
-  width: var(--spacing-32, var(--spacing-32, 32px));
-  height: var(--spacing-32, var(--spacing-32, 32px));
-}
-
-.IncodeVsStepsHeader .IncodeVsStepsHeaderPill {
-  border-radius: var(--radius-full, var(--border-radius-full));
-  background-color: var(--color-surface-neutral-200, var(--surface-neutral-200));
-  width: 100%;
-  height: var(--video-selfie-stepper-pill-height);
-  opacity: .25;
-  transition: opacity .3s ease-in-out;
-}
-
-.IncodeVsStepsHeader .IncodeVsStepsHeaderStepCompleted .IncodeVsStepsHeaderPill {
-  opacity: .5;
-}
-
-.IncodeVsStepsHeader .IncodeVsStepsHeaderStepCurrent .IncodeVsStepsHeaderPill {
-  opacity: 1;
-}
-
-.IncodeVsStepsHeader.IncodeVsStepsHeaderFinished .IncodeVsStepsHeaderPill {
-  background-color: var(--border-status-positive-static);
-  opacity: 1;
-}
-
-.IncodeVsSelfieManualCapture {
-  pointer-events: auto;
-}
-
-.IncodeVideoSelfieOverlay .IncodeVsSelfieMask {
-  border-radius: var(--radius-full, var(--border-radius-full));
-  z-index: var(--video-selfie-mask-z-index);
-  width: 86cqw;
-  height: 86cqw;
-  box-shadow: var(--video-selfie-mask-vignette-shadow);
-  position: absolute;
-  top: calc(50% - 7cqw);
-  left: 50%;
-  transform: translate(-50%, -50%);
-}
-
-.IncodeVideoSelfieOverlay .IncodeVsSelfieMask .IncodeVsSelfieMaskRing {
-  inset: var(--spacing-0, var(--spacing-none, 0px));
-  width: 100%;
-  height: 100%;
-  position: absolute;
-  overflow: visible;
-}
-
-.IncodeVideoSelfieOverlay .IncodeVsSelfieMaskFeedback {
-  inset-inline: var(--spacing-0, var(--spacing-none, 0px));
-  align-items: center;
-  gap: var(--spacing-16, var(--spacing-16, 16px));
-  text-align: center;
-  width: 100%;
-  z-index: var(--video-selfie-chrome-z-index);
-  max-width: var(--video-selfie-feedback-max-width);
-  flex-direction: column;
-  margin-inline: auto;
-  display: flex;
-  position: absolute;
-  top: calc(50% + 36cqw + 40px);
-}
-
-.IncodeVideoSelfieOverlay .IncodeVsSelfieMaskIcon {
-  width: var(--spacing-32, var(--spacing-32, 32px));
-  height: var(--spacing-32, var(--spacing-32, 32px));
-}
-
-.IncodeVideoSelfieOverlay .IncodeVsSelfieMaskText {
-  margin: var(--spacing-0, var(--spacing-none, 0px));
-  font-family: var(--typography-headline-family);
-  font-size: var(--typography-headline-h2-size);
-  font-weight: var(--typography-headline-h2-weight);
-  line-height: var(--typography-headline-h2-line-height);
-  letter-spacing: var(--typography-headline-h2-letter-spacing);
-  color: var(--color-text-body-0-static, var(--text-body-0-static));
-}
-
-.IncodeVsIdMask {
-  z-index: 50;
-  padding-inline: var(--spacing-24);
-  justify-content: center;
-  align-items: center;
-  display: flex;
-  position: absolute;
-  inset: 0;
-}
-
-.IncodeVsIdMask .IncodeVsIdManualCapture {
-  bottom: var(--spacing-32);
-  z-index: 60;
-  pointer-events: auto;
-  position: absolute;
-  left: 50%;
-  transform: translateX(-50%);
-}
-
-.IncodeVsIdMask .IncodeIdCaptureNotification {
-  top: calc(var(--spacing-24) + var(--video-selfie-stepper-height) + var(--spacing-16));
-}
-
-.IncodeVsIdMask .IncodeIdCaptureNotification .IncodeIdCaptureNotificationContent {
-  background-color: var(--surface-neutral-900-static);
-}
-
-.IncodeVsIdMask .IncodeVsIdFeedback {
-  z-index: 100;
-  justify-content: center;
-  align-items: center;
-  gap: var(--spacing-12, var(--spacing-12, 12px));
-  border-radius: var(--radius-medium, var(--border-radius-medium));
-  padding: var(--spacing-32, var(--spacing-32, 32px));
-  text-align: center;
-  font-family: var(--typography-headline-family);
-  font-size: var(--typography-headline-h2-size);
-  font-weight: var(--typography-headline-h2-weight);
-  line-height: var(--typography-headline-h2-line-height);
-  letter-spacing: var(--typography-headline-h2-letter-spacing);
-  color: var(--color-text-body-0-static, var(--text-body-0-static));
-  background-color: var(--surface-neutral-900-static);
-  border: var(--border-width-regular) solid var(--border-neutral-100-static);
-  width: max-content;
-  max-width: var(--video-selfie-id-feedback-max-width);
-  flex-direction: column;
-  display: flex;
-  position: absolute;
-  top: 50%;
-  left: 50%;
-  overflow: hidden;
-  transform: translate(-50%, -50%);
-}
-
-.IncodeVsIdMask .IncodeVsIdFeedback.IncodeVsIdFeedbackError {
-  width: var(--video-selfie-id-feedback-width);
-}
-
-.IncodeVsIdMask .IncodeVsIdFeedback.IncodeVsIdFeedbackProcessing {
-  gap: var(--spacing-16);
-  color: var(--text-body-50-static);
-  width: var(--video-selfie-id-processing-feedback-width);
-  height: var(--video-selfie-id-processing-feedback-height);
-}
-
-.IncodeVsIdMask .IncodeVsIdFeedback.IncodeVsIdFeedbackProcessing p {
-  white-space: nowrap;
-}
-
-.IncodeVsIdMask .IncodeVsIdFeedback .IncodeVsIdFeedbackSpinnerPrimary {
-  fill: var(--spinner-surface-primary);
-}
-
-.IncodeVsIdMask .IncodeVsIdFeedback .IncodeVsIdFeedbackSpinnerSecondary {
-  fill: var(--surface-brand-900-static);
-}
-
-.IncodeVsIdFlipModal .IncodeModalDialog {
-  max-width: none;
-  height: 100%;
-}
-
-.IncodeVsIdFlipModal .IncodeModalContent {
-  border-radius: var(--radius-none, var(--border-radius-none));
-  background-color: var(--color-surface-neutral-0, var(--surface-neutral-0));
-  max-width: none;
-  height: 100%;
-  padding: var(--spacing-24, var(--spacing-24, 24px));
-  justify-content: center;
-  gap: var(--video-selfie-id-flip-gap);
-}
-
-.IncodeVsIdFlipModal .IncodeModalTitleSectionCenter {
-  margin: var(--spacing-0, var(--spacing-none, 0px));
-}
-
-.IncodeVsIdFlipModal .IncodeVsIdFlipAnimation {
-  height: var(--video-selfie-id-flip-animation-height);
-  width: var(--video-selfie-id-flip-animation-width);
-  overflow: hidden;
-}
-
-.IncodeVsFinalSuccess {
-  justify-content: center;
-  align-items: center;
-  gap: var(--spacing-12, var(--spacing-12, 12px));
-  padding-block: var(--spacing-16, var(--spacing-16, 16px));
-  flex-direction: column;
-  flex: 1;
-  display: flex;
-}
-
-.IncodeVsFinalSuccess .IncodeVsFinalSuccessTitle {
-  margin: var(--spacing-0, var(--spacing-none, 0px));
-  text-align: center;
-  font-family: var(--typography-headline-family);
-  font-size: var(--typography-headline-h2-size);
-  font-weight: var(--typography-headline-h2-weight);
-  line-height: var(--typography-headline-h2-line-height);
-  letter-spacing: var(--typography-headline-h2-letter-spacing);
-  color: var(--color-text-body-primary, var(--text-body-800-primary));
-}
-
-.IncodeVsPoaMask {
-  pointer-events: none;
-  z-index: 50;
-  position: absolute;
-  inset: 0;
-}
-
-.IncodeVsPoaBanner {
-  top: var(--spacing-0, var(--spacing-none, 0px));
-  right: var(--spacing-0, var(--spacing-none, 0px));
-  left: var(--spacing-0, var(--spacing-none, 0px));
-  background-color: var(--color-surface-neutral-1000-80-static, var(--surface-neutral-1000-80-static));
-  padding-inline: var(--spacing-16, var(--spacing-16, 16px));
-  padding-top: var(--poa-mask-banner-padding-top);
-  padding-bottom: var(--spacing-16, var(--spacing-16, 16px));
-  justify-content: center;
-  align-items: center;
-  display: flex;
-  position: absolute;
-}
-
-.IncodeVsPoaBannerText {
-  text-align: center;
-  color: var(--poa-mask-banner-text-color);
-  margin: 0;
-  font-size: 1.5rem;
-  font-weight: 700;
-  line-height: 1.4;
-}
-
-.IncodeVsPoaBannerEmphasis {
-  color: var(--poa-mask-emphasis-color);
-}
-
-.IncodeVsPoaActions {
-  right: var(--spacing-16, var(--spacing-16, 16px));
-  bottom: var(--spacing-16, var(--spacing-16, 16px));
-  left: var(--spacing-16, var(--spacing-16, 16px));
-  justify-content: center;
-  display: flex;
-  position: absolute;
-}
-
-.IncodeVsPoaButton {
-  pointer-events: auto;
-  width: 100%;
-}
-
-.IncodeVsVoicePanel {
-  pointer-events: auto;
-  z-index: var(--video-selfie-mask-z-index);
-  align-items: center;
-  gap: var(--spacing-12);
-  padding: var(--spacing-20) var(--spacing-16);
-  border-radius: var(--border-radius-large);
-  background: var(--surface-neutral-0-static);
-  color: var(--text-body-800-primary-static);
-  border: var(--video-selfie-voice-panel-border-width) solid transparent;
-  box-shadow: var(--video-selfie-voice-vignette-shadow);
-  flex-direction: column;
-  transition: border-color .3s ease-in-out;
-  display: flex;
-  position: absolute;
-  bottom: 10px;
-  left: 10px;
-  right: 10px;
-}
-
-.IncodeVsVoicePanel.IncodeVsVoicePanelActive {
-  border-color: var(--border-brand-500);
-}
-
-.IncodeVsVoicePanel.IncodeVsVoicePanelProcessing {
-  border-style: var(--tw-border-style);
-  left: var(--spacing-8);
-  right: var(--spacing-8);
-  bottom: var(--spacing-8);
-  justify-content: center;
-  align-items: center;
-  gap: var(--spacing-16);
-  height: var(--video-selfie-voice-processing-height);
-  min-height: var(--video-selfie-voice-processing-height);
-  padding: var(--spacing-24) var(--spacing-16);
-  border-width: 0;
-}
-
-.IncodeVsVoicePanel .IncodeVsVoicePanelProcessingTitle {
-  margin: var(--spacing-0, var(--spacing-none, 0px));
-  text-align: center;
-  font-family: var(--typography-headline-family);
-  font-size: var(--typography-headline-h2-size);
-  font-weight: var(--typography-headline-h2-weight);
-  line-height: var(--typography-headline-h2-line-height);
-  letter-spacing: var(--typography-headline-h2-letter-spacing);
-  color: var(--color-spinner-text-title, var(--spinner-text-title));
-}
-
-.IncodeVsVoicePanel .IncodeVsVoicePanelLabel {
-  margin: var(--spacing-0, var(--spacing-none, 0px));
-  font-family: var(--typography-headline-family);
-  font-size: var(--typography-headline-h4-size);
-  font-weight: var(--typography-headline-h4-weight);
-  line-height: var(--typography-headline-h4-line-height);
-  letter-spacing: var(--typography-headline-h4-letter-spacing);
-  color: var(--text-body-500-secondary-static);
-}
-
-.IncodeVsVoicePanel .IncodeVsVoicePanelTitle {
-  margin: var(--spacing-0, var(--spacing-none, 0px));
-  padding-inline: var(--spacing-16, var(--spacing-16, 16px));
-  text-align: center;
-  font-family: var(--typography-headline-family);
-  font-size: var(--typography-headline-h2-size);
-  font-weight: var(--typography-headline-h2-weight);
-  line-height: var(--typography-headline-h2-line-height);
-  letter-spacing: var(--typography-headline-h2-letter-spacing);
-  color: var(--text-body-800-primary-static);
-}
-
-.IncodeVsVoicePanel .IncodeVsVoicePanelButton {
-  width: 100%;
-}
-
-.IncodeVsVoicePanel .IncodeVsVoiceStepper {
-  margin: var(--spacing-0, var(--spacing-none, 0px));
-  gap: var(--spacing-8, var(--spacing-8, 8px));
-  width: 100%;
-  padding: var(--spacing-0, var(--spacing-none, 0px));
-  list-style-type: none;
-  display: flex;
-}
-
-.IncodeVsVoicePanel .IncodeVsVoiceStep {
-  height: var(--spacing-4);
-  border-radius: var(--border-radius-full);
-  background: var(--surface-neutral-100-static);
-  flex: 1;
-}
-
-.IncodeVsVoicePanel .IncodeVsVoiceStepActive {
-  background: var(--surface-brand-500-static);
-}
-
-.IncodeVsVoicePanel .IncodeVsVoiceMic {
-  width: var(--spacing-16);
-  height: var(--spacing-16);
-  border-radius: var(--border-radius-full);
-  background: var(--icon-status-negative);
-  animation: 1.2s ease-in-out infinite IncodeVsVoiceMicPulse;
-}
-
-@keyframes IncodeVsVoiceMicPulse {
-  0%, 100% {
-    opacity: 1;
-    transform: scale(1);
-  }
-
-  50% {
-    opacity: .4;
-    transform: scale(.8);
-  }
-}
-
-@property --tw-border-style {
-  syntax: "*";
-  inherits: false;
-  initial-value: solid;
-}
-
-@property --tw-translate-x {
-  syntax: "*";
-  inherits: false;
-  initial-value: 0;
-}
-
-@property --tw-translate-y {
-  syntax: "*";
-  inherits: false;
-  initial-value: 0;
-}
-
-@property --tw-translate-z {
-  syntax: "*";
-  inherits: false;
-  initial-value: 0;
-}
-
-@property --tw-rotate-x {
-  syntax: "*";
-  inherits: false
-}
-
-@property --tw-rotate-y {
-  syntax: "*";
-  inherits: false
-}
-
-@property --tw-rotate-z {
-  syntax: "*";
-  inherits: false
-}
-
-@property --tw-skew-x {
-  syntax: "*";
-  inherits: false
-}
-
-@property --tw-skew-y {
-  syntax: "*";
-  inherits: false
-}
-
-@keyframes spin {
-  to {
-    transform: rotate(360deg);
-  }
-}
+@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){.IncodeComponent,.IncodeComponent *,.IncodeComponent :before,.IncodeComponent :after,.IncodeComponent ::backdrop{--tw-border-style:solid;--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial}}}@layer incode-theme,incode-utilities,incode-base,incode-components;@keyframes slideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes incodeToastFadeInOut{0%{opacity:0;transform:translate(-50%,-20px)}15%{opacity:1;transform:translate(-50%)}85%{opacity:1;transform:translate(-50%)}to{opacity:0;transform:translate(-50%,-20px)}}.IncodeCaptureContainer{flex-direction:column;flex:1;justify-content:flex-start;align-items:center;width:100%;height:100%;display:flex;position:relative;overflow:hidden}.IncodeCaptureContainer .IncodeCaptureFrame{aspect-ratio:1;width:100%;max-width:var(--face-capture-frame-max-w);border-radius:var(--radius-full,var(--border-radius-full));border-style:var(--tw-border-style);border-width:12px;border-color:#0000;position:relative}.IncodeCaptureContainer .IncodeCaptureVideoWrapper{--tw-translate-x:calc(calc(1 / 2 * 100%) * -1);--tw-translate-y:calc(calc(1 / 2 * 100%) * -1);width:calc(100% - 24px);height:calc(100% - 24px);translate:var(--tw-translate-x) var(--tw-translate-y);transform:var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, );border-radius:var(--radius-full,var(--border-radius-full));background-color:var(--color-surface-neutral-100-static,var(--surface-neutral-100-static));justify-content:center;align-items:center;display:flex;position:absolute;top:50%;left:50%;overflow:hidden}.IncodeCaptureContainer .IncodeCaptureVideo{z-index:50;width:100%;height:100%;position:absolute}.IncodeCaptureContainer .IncodeCaptureVideoElement{inset:var(--spacing-0,var(--spacing-none,0px));object-fit:cover;width:100%;height:100%;position:absolute}.IncodeCaptureContainer .IncodeCaptureVideoElement.IncodeMediaCoverPending{opacity:0}.IncodeCaptureContainer .IncodeCaptureVideoElement.IncodeCaptureVideoMirrored{transform:scaleX(-1)}.IncodeCaptureContainer .IncodeCaptureAvatarHost{width:100%;height:100%;position:absolute}.IncodeCaptureContainer .IncodeCaptureAvatarElement{inset:var(--spacing-0,var(--spacing-none,0px));object-fit:cover;width:100%;height:100%;position:absolute}.IncodeCaptureContainer .IncodeCaptureAvatarElement.IncodeMediaCoverPending{opacity:0}.IncodeCaptureContainer .IncodeCaptureAvatarElement.IncodeCaptureAvatarMirrored{transform:scaleX(-1)}.IncodeCaptureVisuallyHidden{clip-path:inset(50%);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.IncodeFaceOutline{width:100%;height:100%}.IncodeLoadingBorder{aspect-ratio:1;width:100%;max-width:var(--face-capture-frame-max-w);position:absolute}.IncodeLoadingBorder .IncodeLoadingBorderBase,.IncodeLoadingBorder .IncodeLoadingBorderForeground{inset:var(--spacing-0,var(--spacing-none,0px));position:absolute}.IncodeLoadingBorder .IncodeLoadingBorderForeground.IncodeLoadingBorderSpinning{animation:var(--animate-spin,spin 1s linear infinite)}.IncodeLoadingBorder .IncodeLoadingBorderPath{transition:all 1s ease-in-out}.IncodeNotification{flex-direction:column;align-items:center;display:flex}.IncodeNotification .IncodeNotificationText{text-align:center;font-family:var(--typography-feedback-family);font-size:var(--typography-feedback-l-size);font-weight:var(--typography-feedback-l-weight);line-height:var(--typography-feedback-l-line-height);letter-spacing:var(--typography-feedback-l-letter-spacing);color:var(--color-text-body-primary,var(--text-body-800-primary))}.IncodeIdCaptureNotification{right:var(--spacing-24,var(--spacing-24,24px));left:var(--spacing-24,var(--spacing-24,24px));z-index:100;max-width:var(--incode-form-max-w);padding-bottom:var(--spacing-32,var(--spacing-32,32px));top:var(--incode-overlay-top-inset,var(--spacing-24));align-items:flex-end;margin:auto;display:flex;position:absolute}.IncodeIdCaptureNotification .IncodeIdCaptureNotificationContent{z-index:100;border-radius:var(--radius-large,var(--border-radius-large));border-style:var(--tw-border-style);border-width:2px;border-color:var(--color-border-neutral-300,var(--border-neutral-300));background-color:var(--color-surface-neutral-900-80,var(--surface-neutral-900-80));width:100%;padding-inline:var(--spacing-20,var(--spacing-20,20px));box-shadow:var(--id-capture-notification-content-shadow);display:flex;overflow:hidden}.IncodeIdCaptureNotification .IncodeIdCaptureNotificationContent.IncodeIdCaptureNotificationContent--minimal{justify-content:center}.IncodeIdCaptureNotification .IncodeIdCaptureNotificationContent .IncodeIdCaptureNotificationText{justify-content:center;gap:var(--spacing-8,var(--spacing-8,8px));padding-top:var(--spacing-16,var(--spacing-16,16px));padding-bottom:var(--spacing-12,var(--spacing-12,12px));text-align:center;color:var(--color-text-body-0-static,var(--text-body-0-static));flex-direction:column;display:flex}.IncodeIdCaptureNotification .IncodeIdCaptureNotificationContent .IncodeIdCaptureNotificationText .IncodeIdCaptureNotificationTitle{font-family:var(--typography-headline-family);font-size:var(--typography-headline-h3-size);font-weight:var(--typography-headline-h3-weight);line-height:var(--typography-headline-h3-line-height);letter-spacing:var(--typography-headline-h3-letter-spacing)}.IncodeIdCaptureNotification .IncodeIdCaptureNotificationContent .IncodeIdCaptureNotificationText .IncodeIdCaptureNotificationDescription{font-family:var(--typography-headline-family);font-size:var(--typography-headline-h5-size);font-weight:var(--typography-headline-h5-weight);line-height:var(--typography-headline-h5-line-height);letter-spacing:var(--typography-headline-h5-letter-spacing);color:var(--color-text-body-tertiary-static,var(--text-body-300-tertiary-static))}.IncodeIdCaptureNotification .IncodeIdCaptureNotificationContent.IncodeIdCaptureNotificationContent--minimal .IncodeIdCaptureNotificationText{gap:var(--spacing-4,var(--spacing-4,4px));padding-block:var(--spacing-16,var(--spacing-16,16px))}.IncodeIdCaptureNotification .IncodeIdCaptureNotificationContent.IncodeIdCaptureNotificationContent--minimal .IncodeIdCaptureNotificationText .IncodeIdCaptureNotificationTitle{font-family:var(--typography-headline-family);font-size:var(--typography-headline-h5-size);font-weight:var(--typography-headline-h5-weight);line-height:var(--typography-headline-h5-line-height);letter-spacing:var(--typography-headline-h5-letter-spacing)}.IncodeIdCaptureNotification .IncodeIdCaptureNotificationContent.IncodeIdCaptureNotificationContent--minimal .IncodeIdCaptureNotificationText .IncodeIdCaptureNotificationDescription{font-family:var(--typography-body-family);font-size:var(--typography-body-m-regular-size);font-weight:var(--typography-body-m-regular-weight);line-height:var(--typography-body-m-regular-line-height);letter-spacing:var(--typography-body-m-regular-letter-spacing)}.IncodeIdCaptureNotification .IncodeIdCaptureNotificationContent .IncodeIdCaptureNotificationAnimation{height:var(--id-capture-notification-animation-height);justify-content:center;align-items:center;width:auto;display:flex}.IncodeVideoSelfieCapturePage{background-color:var(--capture-page-backdrop-color)}.IncodeVideoSelfieCapturePage .IncodePageInner{padding:var(--spacing-0,var(--spacing-none,0px));max-height:none}.IncodeVideoSelfieCapturePage .IncodePageContent{flex:1;position:relative}.IncodeVideoSelfieOverlay{pointer-events:none;inset:var(--spacing-0,var(--spacing-none,0px));z-index:10;flex-direction:column;align-items:center;display:flex;position:absolute;container-type:inline-size}.IncodeVideoSelfieSwitchingCameraPage{background-color:var(--color-surface-neutral-900-static,var(--surface-neutral-900-static))}.IncodeVideoSelfieSwitchingCameraPage .IncodePageInner{padding:var(--spacing-0,var(--spacing-none,0px))}.IncodeVideoSelfieSwitchingCameraPage .IncodePageContent{flex:1;position:relative}.IncodeVideoSelfieSwitchingCameraPage .IncodeVideoSelfieSwitchingCamera{width:100%;height:100%;padding-inline:var(--spacing-24,var(--spacing-24,24px));flex-direction:column;justify-content:center;align-items:center;display:flex;position:relative}.IncodeVideoSelfieSwitchingCameraPage .IncodeVideoSelfieSwitchingCameraContent{align-items:center;gap:var(--spacing-16,var(--spacing-16,16px));text-align:center;flex-direction:column;display:flex}.IncodeVideoSelfieSwitchingCameraPage .IncodeVideoSelfieSwitchingCameraIcon{width:var(--spacing-40,var(--spacing-40,40px));height:var(--spacing-40,var(--spacing-40,40px))}.IncodeVideoSelfieSwitchingCameraPage .IncodeVideoSelfieSwitchingCameraTitle{font-family:var(--typography-headline-family);font-size:var(--typography-headline-h2-size);font-weight:var(--typography-headline-h2-weight);line-height:var(--typography-headline-h2-line-height);letter-spacing:var(--typography-headline-h2-letter-spacing);color:var(--color-text-body-0-static,var(--text-body-0-static))}.IncodeVideoSelfieTutorialPage .IncodePageContent{min-height:var(--spacing-0,var(--spacing-none,0px))}.IncodeVideoSelfieTutorialBody{margin-top:var(--spacing-24,var(--spacing-24,24px));min-height:var(--spacing-0,var(--spacing-none,0px));flex:1;overflow-y:auto}.IncodeVideoSelfieTutorialSteps{width:100%;max-width:var(--incode-form-max-w);gap:var(--spacing-8,var(--spacing-8,8px));flex-direction:column;margin-inline:auto;display:flex}.IncodeVideoSelfieTutorialStep{align-items:center;gap:var(--spacing-12,var(--spacing-12,12px));display:flex}.IncodeVideoSelfieTutorialStepIcon{width:var(--spacing-40,var(--spacing-40,40px));height:var(--spacing-40,var(--spacing-40,40px));border-radius:var(--radius-small,var(--border-radius-small));border-style:var(--tw-border-style);border-width:2px;border-color:var(--color-border-neutral-100,var(--border-neutral-100));background-color:var(--color-surface-neutral-0,var(--surface-neutral-0));color:var(--color-text-body-secondary,var(--text-body-500-secondary));flex-shrink:0;justify-content:center;align-items:center;display:flex;position:relative}.IncodeVideoSelfieTutorialStepIcon svg{height:var(--spacing-24,var(--spacing-24,24px));width:var(--spacing-24,var(--spacing-24,24px))}.IncodeVideoSelfieTutorialStep:not(:last-child) .IncodeVideoSelfieTutorialStepIcon:after{content:"";height:var(--spacing-8,var(--spacing-8,8px));width:var(--spacing-2,var(--spacing-2,2px));--tw-translate-x:calc(calc(1 / 2 * 100%) * -1);translate:var(--tw-translate-x) var(--tw-translate-y);background-color:var(--color-border-neutral-100,var(--border-neutral-100));position:absolute;top:100%;left:50%}.IncodeVideoSelfieTutorialStepLabel{text-align:left;font-family:var(--typography-headline-family);font-size:var(--typography-headline-h4-size);font-weight:var(--typography-headline-h4-weight);line-height:var(--typography-headline-h4-line-height);letter-spacing:var(--typography-headline-h4-letter-spacing);color:var(--color-text-body-secondary,var(--text-body-500-secondary))}.IncodeVideoSelfieTutorialActions{bottom:var(--spacing-0,var(--spacing-none,0px));background-color:var(--color-surface-neutral-0,var(--surface-neutral-0));width:100%;padding-top:var(--spacing-24,var(--spacing-24,24px));padding-bottom:var(--spacing-24,var(--spacing-24,24px));flex-shrink:0;display:flex;position:sticky}.IncodeVideoSelfieTutorialStartButton{max-width:var(--incode-form-max-w);margin:auto}.IncodeVsStepsHeader{inset-inline:var(--spacing-0,var(--spacing-none,0px));top:var(--spacing-0,var(--spacing-none,0px));gap:var(--spacing-2,var(--spacing-2,2px));width:100%;padding-inline:var(--spacing-24,var(--spacing-24,24px));padding-top:var(--spacing-24,var(--spacing-24,24px));color:var(--color-text-body-0-static,var(--text-body-0-static));z-index:var(--video-selfie-chrome-z-index);background-color:#0000;list-style-type:none;display:flex;position:absolute}.IncodeVsStepsHeader .IncodeVsStepsHeaderStep{align-items:center;gap:var(--spacing-8,var(--spacing-8,8px));width:100%;height:var(--video-selfie-stepper-height);flex-direction:column;flex:1;display:flex;position:relative}.IncodeVsStepsHeader .IncodeVsStepsHeaderStep img{width:var(--spacing-32,var(--spacing-32,32px));height:var(--spacing-32,var(--spacing-32,32px))}.IncodeVsStepsHeader .IncodeVsStepsHeaderPill{border-radius:var(--radius-full,var(--border-radius-full));background-color:var(--color-surface-neutral-200,var(--surface-neutral-200));width:100%;height:var(--video-selfie-stepper-pill-height);opacity:.25;transition:opacity .3s ease-in-out}.IncodeVsStepsHeader .IncodeVsStepsHeaderStepCompleted .IncodeVsStepsHeaderPill{opacity:.5}.IncodeVsStepsHeader .IncodeVsStepsHeaderStepCurrent .IncodeVsStepsHeaderPill{opacity:1}.IncodeVsStepsHeader.IncodeVsStepsHeaderFinished .IncodeVsStepsHeaderPill{background-color:var(--border-status-positive-static);opacity:1}.IncodeVsSelfieManualCapture{pointer-events:auto}.IncodeVideoSelfieOverlay .IncodeVsSelfieMask{border-radius:var(--radius-full,var(--border-radius-full));z-index:var(--video-selfie-mask-z-index);width:86cqw;height:86cqw;box-shadow:var(--video-selfie-mask-vignette-shadow);position:absolute;top:calc(50% - 7cqw);left:50%;transform:translate(-50%,-50%)}.IncodeVideoSelfieOverlay .IncodeVsSelfieMask .IncodeVsSelfieMaskRing{inset:var(--spacing-0,var(--spacing-none,0px));width:100%;height:100%;position:absolute;overflow:visible}.IncodeVideoSelfieOverlay .IncodeVsSelfieMaskFeedback{inset-inline:var(--spacing-0,var(--spacing-none,0px));align-items:center;gap:var(--spacing-16,var(--spacing-16,16px));text-align:center;width:100%;z-index:var(--video-selfie-chrome-z-index);max-width:var(--video-selfie-feedback-max-width);flex-direction:column;margin-inline:auto;display:flex;position:absolute;top:calc(50% + 36cqw + 40px)}.IncodeVideoSelfieOverlay .IncodeVsSelfieMaskIcon{width:var(--spacing-32,var(--spacing-32,32px));height:var(--spacing-32,var(--spacing-32,32px))}.IncodeVideoSelfieOverlay .IncodeVsSelfieMaskText{margin:var(--spacing-0,var(--spacing-none,0px));font-family:var(--typography-headline-family);font-size:var(--typography-headline-h2-size);font-weight:var(--typography-headline-h2-weight);line-height:var(--typography-headline-h2-line-height);letter-spacing:var(--typography-headline-h2-letter-spacing);color:var(--color-text-body-0-static,var(--text-body-0-static))}.IncodeVsIdMask{z-index:50;padding-inline:var(--spacing-24);justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.IncodeVsIdMask .IncodeVsIdManualCapture{bottom:var(--spacing-32);z-index:60;pointer-events:auto;position:absolute;left:50%;transform:translate(-50%)}.IncodeVsIdMask .IncodeIdCaptureNotification{top:calc(var(--spacing-24) + var(--video-selfie-stepper-height) + var(--spacing-16))}.IncodeVsIdMask .IncodeIdCaptureNotification .IncodeIdCaptureNotificationContent{background-color:var(--surface-neutral-900-static)}.IncodeVsIdMask .IncodeVsIdFeedback{z-index:100;justify-content:center;align-items:center;gap:var(--spacing-12,var(--spacing-12,12px));border-radius:var(--radius-medium,var(--border-radius-medium));padding:var(--spacing-32,var(--spacing-32,32px));text-align:center;font-family:var(--typography-headline-family);font-size:var(--typography-headline-h2-size);font-weight:var(--typography-headline-h2-weight);line-height:var(--typography-headline-h2-line-height);letter-spacing:var(--typography-headline-h2-letter-spacing);color:var(--color-text-body-0-static,var(--text-body-0-static));background-color:var(--surface-neutral-900-static);border:var(--border-width-regular) solid var(--border-neutral-100-static);width:max-content;max-width:var(--video-selfie-id-feedback-max-width);flex-direction:column;display:flex;position:absolute;top:50%;left:50%;overflow:hidden;transform:translate(-50%,-50%)}.IncodeVsIdMask .IncodeVsIdFeedback.IncodeVsIdFeedbackError{width:var(--video-selfie-id-feedback-width)}.IncodeVsIdMask .IncodeVsIdFeedback.IncodeVsIdFeedbackProcessing{gap:var(--spacing-16);color:var(--text-body-50-static);width:var(--video-selfie-id-processing-feedback-width);height:var(--video-selfie-id-processing-feedback-height)}.IncodeVsIdMask .IncodeVsIdFeedback.IncodeVsIdFeedbackProcessing p{white-space:nowrap}.IncodeVsIdMask .IncodeVsIdFeedback .IncodeVsIdFeedbackSpinnerPrimary{fill:var(--spinner-surface-primary)}.IncodeVsIdMask .IncodeVsIdFeedback .IncodeVsIdFeedbackSpinnerSecondary{fill:var(--surface-brand-900-static)}.IncodeVsIdFlipModal .IncodeModalDialog{max-width:none;height:100%}.IncodeVsIdFlipModal .IncodeModalContent{border-radius:var(--radius-none,var(--border-radius-none));background-color:var(--color-surface-neutral-0,var(--surface-neutral-0));max-width:none;height:100%;padding:var(--spacing-24,var(--spacing-24,24px));justify-content:center;gap:var(--video-selfie-id-flip-gap)}.IncodeVsIdFlipModal .IncodeModalTitleSectionCenter{margin:var(--spacing-0,var(--spacing-none,0px))}.IncodeVsIdFlipModal .IncodeVsIdFlipAnimation{height:var(--video-selfie-id-flip-animation-height);width:var(--video-selfie-id-flip-animation-width);overflow:hidden}.IncodeVsFinalSuccess{justify-content:center;align-items:center;gap:var(--spacing-12,var(--spacing-12,12px));padding-block:var(--spacing-16,var(--spacing-16,16px));flex-direction:column;flex:1;display:flex}.IncodeVsFinalSuccess .IncodeVsFinalSuccessTitle{margin:var(--spacing-0,var(--spacing-none,0px));text-align:center;font-family:var(--typography-headline-family);font-size:var(--typography-headline-h2-size);font-weight:var(--typography-headline-h2-weight);line-height:var(--typography-headline-h2-line-height);letter-spacing:var(--typography-headline-h2-letter-spacing);color:var(--color-text-body-primary,var(--text-body-800-primary))}.IncodeVsPoaMask{pointer-events:none;z-index:50;position:absolute;inset:0}.IncodeVsPoaBanner{top:var(--spacing-0,var(--spacing-none,0px));right:var(--spacing-0,var(--spacing-none,0px));left:var(--spacing-0,var(--spacing-none,0px));background-color:var(--color-surface-neutral-1000-80-static,var(--surface-neutral-1000-80-static));padding-inline:var(--spacing-16,var(--spacing-16,16px));padding-top:var(--poa-mask-banner-padding-top);padding-bottom:var(--spacing-16,var(--spacing-16,16px));justify-content:center;align-items:center;display:flex;position:absolute}.IncodeVsPoaBannerText{text-align:center;color:var(--poa-mask-banner-text-color);margin:0;font-size:1.5rem;font-weight:700;line-height:1.4}.IncodeVsPoaBannerEmphasis{color:var(--poa-mask-emphasis-color)}.IncodeVsPoaActions{right:var(--spacing-16,var(--spacing-16,16px));bottom:var(--spacing-16,var(--spacing-16,16px));left:var(--spacing-16,var(--spacing-16,16px));justify-content:center;display:flex;position:absolute}.IncodeVsPoaButton{pointer-events:auto;width:100%}.IncodeVsVoicePanel{pointer-events:auto;z-index:var(--video-selfie-mask-z-index);align-items:center;gap:var(--spacing-12);padding:var(--spacing-20) var(--spacing-16);border-radius:var(--border-radius-large);background:var(--surface-neutral-0-static);color:var(--text-body-800-primary-static);border:var(--video-selfie-voice-panel-border-width) solid transparent;box-shadow:var(--video-selfie-voice-vignette-shadow);flex-direction:column;transition:border-color .3s ease-in-out;display:flex;position:absolute;bottom:10px;left:10px;right:10px}.IncodeVsVoicePanel.IncodeVsVoicePanelActive{border-color:var(--border-brand-500)}.IncodeVsVoicePanel.IncodeVsVoicePanelProcessing{border-style:var(--tw-border-style);left:var(--spacing-8);right:var(--spacing-8);bottom:var(--spacing-8);justify-content:center;align-items:center;gap:var(--spacing-16);height:var(--video-selfie-voice-processing-height);min-height:var(--video-selfie-voice-processing-height);padding:var(--spacing-24) var(--spacing-16);border-width:0}.IncodeVsVoicePanel .IncodeVsVoicePanelProcessingTitle{margin:var(--spacing-0,var(--spacing-none,0px));text-align:center;font-family:var(--typography-headline-family);font-size:var(--typography-headline-h2-size);font-weight:var(--typography-headline-h2-weight);line-height:var(--typography-headline-h2-line-height);letter-spacing:var(--typography-headline-h2-letter-spacing);color:var(--color-spinner-text-title,var(--spinner-text-title))}.IncodeVsVoicePanel .IncodeVsVoicePanelLabel{margin:var(--spacing-0,var(--spacing-none,0px));font-family:var(--typography-headline-family);font-size:var(--typography-headline-h4-size);font-weight:var(--typography-headline-h4-weight);line-height:var(--typography-headline-h4-line-height);letter-spacing:var(--typography-headline-h4-letter-spacing);color:var(--text-body-500-secondary-static)}.IncodeVsVoicePanel .IncodeVsVoicePanelTitle{margin:var(--spacing-0,var(--spacing-none,0px));padding-inline:var(--spacing-16,var(--spacing-16,16px));text-align:center;font-family:var(--typography-headline-family);font-size:var(--typography-headline-h2-size);font-weight:var(--typography-headline-h2-weight);line-height:var(--typography-headline-h2-line-height);letter-spacing:var(--typography-headline-h2-letter-spacing);color:var(--text-body-800-primary-static)}.IncodeVsVoicePanel .IncodeVsVoicePanelButton{width:100%}.IncodeVsVoicePanel .IncodeVsVoiceStepper{margin:var(--spacing-0,var(--spacing-none,0px));gap:var(--spacing-8,var(--spacing-8,8px));width:100%;padding:var(--spacing-0,var(--spacing-none,0px));list-style-type:none;display:flex}.IncodeVsVoicePanel .IncodeVsVoiceStep{height:var(--spacing-4);border-radius:var(--border-radius-full);background:var(--surface-neutral-100-static);flex:1}.IncodeVsVoicePanel .IncodeVsVoiceStepActive{background:var(--surface-brand-500-static)}.IncodeVsVoicePanel .IncodeVsVoiceMic{width:var(--spacing-16);height:var(--spacing-16);border-radius:var(--border-radius-full);background:var(--icon-status-negative);animation:1.2s ease-in-out infinite IncodeVsVoiceMicPulse}@keyframes IncodeVsVoiceMicPulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(.8)}}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@keyframes spin{to{transform:rotate(360deg)}}