/*! 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-translate-x: 0;
      --tw-translate-y: 0;
      --tw-translate-z: 0;
      --tw-font-weight: initial;
      --tw-border-style: solid;
      --tw-outline-style: solid;
      --tw-duration: initial;
    }
  }
}

.IncodeSrOnly {
  clip-path: inset(50%);
  white-space: nowrap;
  border-width: 0;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  position: absolute;
  overflow: hidden;
}

.IncodeAgeVerificationPage .IncodePageInner {
  padding-top: var(--spacing-8, var(--spacing-8, 8px));
  padding-bottom: var(--spacing-16, var(--spacing-16, 16px));
}

.IncodeAgeVerificationPage .IncodePageHeader {
  height: var(--page-header-height);
  min-height: var(--page-header-height);
}

.IncodeAgeVerificationPage .IncodePageLogo {
  height: var(--age-verification-logo-height);
}

.IncodeAgeVerificationPage .IncodePageTitleContainer {
  max-width: none;
}

.IncodeAgeVerificationPage .IncodePageContent {
  justify-content: center;
}

.IncodeAgeVerificationPage .IncodePageFooter {
  padding-top: var(--spacing-12, var(--spacing-12, 12px));
  padding-bottom: var(--spacing-0, var(--spacing-none, 0px));
}

.IncodeAgeVerificationPage .IncodeAgeVerificationContent {
  justify-content: space-between;
  align-items: center;
  gap: var(--spacing-16, var(--spacing-16, 16px));
  flex-direction: column;
  flex: 1;
  display: flex;
}

.IncodeAgeVerificationPage .IncodeAgeVerificationList {
  width: 100%;
  max-width: var(--incode-form-max-w);
  justify-content: center;
  gap: var(--spacing-16, var(--spacing-16, 16px));
  padding: var(--spacing-0, var(--spacing-none, 0px));
  flex-direction: column;
  flex: 1;
  margin-inline: auto;
  list-style-type: none;
  display: flex;
}

.IncodeAgeVerificationPage .IncodeAgeVerificationItem {
  align-items: center;
  gap: var(--spacing-16, var(--spacing-16, 16px));
  display: flex;
}

.IncodeAgeVerificationPage .IncodeAgeVerificationIcon {
  height: var(--spacing-64, var(--spacing-64, 64px));
  width: var(--spacing-96, var(--spacing-96, 96px));
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  display: flex;
}

.IncodeAgeVerificationPage .IncodeAgeVerificationIcon img {
  width: 100%;
  height: 100%;
}

.IncodeAgeVerificationPage .IncodeAgeVerificationText {
  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-primary, var(--text-body-800-primary));
  flex: 1;
}

.IncodeAgeVerificationPage .IncodeAgeVerificationButton {
  width: 100%;
  max-width: var(--incode-form-max-w);
  margin-inline: auto;
}

.IncodeIdTutorial .IncodePageTitleContainer {
  padding-block: var(--spacing-16, var(--spacing-16, 16px));
}

.IncodeIdTutorial .IncodeBaseTutorialContainer {
  margin: calc(var(--spacing-24, var(--spacing-24, 24px)) * -1);
}

.IncodeIdTutorial .IncodeBaseTutorialAnimationContainer {
  padding: var(--spacing-0, var(--spacing-none, 0px));
}

.IncodeFlipAnimation {
  background-color: var(--color-surface-neutral-0, var(--surface-neutral-0));
  height: 100%;
  padding: var(--spacing-24, var(--spacing-24, 24px));
  flex-direction: column;
  justify-content: center;
  align-items: center;
  display: flex;
}

.IncodeIdFlipCardPage .IncodePageInner {
  padding: var(--spacing-0, var(--spacing-none, 0px));
}

.IncodeIdFlipCardLayout {
  width: 100%;
  height: 100%;
  padding: var(--spacing-24, var(--spacing-24, 24px));
  background-color: var(--color-surface-neutral-0, var(--surface-neutral-0));
  flex-direction: column;
  justify-content: center;
  align-items: center;
  display: flex;
}

.IncodeIdFlipCardLayout .IncodeIdFlipCardLayoutContent {
  z-index: 10;
  flex-direction: column;
  align-items: center;
  width: 100%;
  height: 100%;
  display: flex;
}

.IncodeIdFlipCardLayout .IncodeIdFlipCardLayoutContent .IncodeIdFlipCardTopArea {
  justify-content: flex-end;
  align-items: center;
  gap: var(--spacing-24, var(--spacing-24, 24px));
  padding-bottom: var(--spacing-40, var(--spacing-40, 40px));
  z-index: 10;
  flex-direction: column;
  flex: 1;
  width: 100%;
  display: flex;
}

.IncodeIdFlipCardLayout .IncodeIdFlipCardLayoutContent .IncodeIdFlipCardCopy {
  opacity: 0;
  flex-direction: column;
  align-items: center;
  animation: .3s ease-out forwards incodeIdFlipCardFadeIn;
  display: flex;
}

.IncodeIdFlipCardLayout .IncodeIdFlipCardLayoutContent .IncodeIdFlipCardTitle {
  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));
}

.IncodeIdFlipCardLayout .IncodeIdFlipCardLayoutContent .IncodeIdFlipCardSubtitle {
  text-align: center;
  max-width: 300px;
  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-secondary, var(--text-body-500-secondary));
}

.IncodeIdFlipCardLayout .IncodeIdFlipCardLayoutContent .IncodeCaptureFrame {
  overflow: hidden;
}

.IncodeIdFlipCardLayout .IncodeIdFlipCardLayoutContent .IncodeCaptureFrame.IncodeCaptureFrameVertical {
  width: clamp(180px, 30vh, 274px);
}

.IncodeIdFlipCardLayout .IncodeIdFlipCardLayoutContent .IncodeCaptureFrame.IncodeIdFlipCardFrameFlipping {
  --frame-border-color: var(--border-neutral-100);
}

.IncodeIdFlipCardLayout .IncodeIdFlipCardLayoutContent .IncodeIdFlipCardScene {
  perspective: 1200px;
  width: 100%;
  height: 100%;
}

.IncodeIdFlipCardLayout .IncodeIdFlipCardLayoutContent .IncodeIdFlipCardCard {
  width: 100%;
  height: 100%;
  transform-style: preserve-3d;
  animation: 1s ease-in-out .6s forwards incodeIdFlipCardRotate;
  position: relative;
}

@media (prefers-reduced-motion: reduce) {
  .IncodeIdFlipCardLayout .IncodeIdFlipCardLayoutContent .IncodeIdFlipCardCard {
    animation: none;
  }
}

.IncodeIdFlipCardLayout .IncodeIdFlipCardLayoutContent .IncodeIdFlipCardFace {
  inset: var(--spacing-0, var(--spacing-none, 0px));
  backface-visibility: hidden;
  width: 100%;
  height: 100%;
  position: absolute;
}

.IncodeIdFlipCardLayout .IncodeIdFlipCardLayoutContent .IncodeIdFlipCardFace.IncodeIdFlipCardFaceBack {
  transform: rotateY(180deg);
}

@media (prefers-reduced-motion: reduce) {
  .IncodeIdFlipCardLayout .IncodeIdFlipCardLayoutContent .IncodeIdFlipCardFace.IncodeIdFlipCardFaceBack {
    opacity: 0;
    animation: 1s ease-in-out .6s forwards incodeIdFlipCardReducedMotionFadeIn;
    transform: none;
  }
}

.IncodeIdFlipCardLayout .IncodeIdFlipCardLayoutContent .IncodeIdFlipCardImage {
  object-fit: cover;
  width: 100%;
  height: 100%;
  animation: 1s ease-in-out .6s forwards incodeIdFlipCardFrontFade;
}

@media (prefers-reduced-motion: reduce) {
  .IncodeIdFlipCardLayout .IncodeIdFlipCardLayoutContent .IncodeIdFlipCardImage {
    animation: 1s ease-in-out .6s forwards incodeIdFlipCardReducedMotionFadeOut;
  }
}

.IncodeIdFlipCardLayout .IncodeIdFlipCardLayoutContent .IncodeIdFlipCardAsset {
  object-fit: cover;
  width: 100%;
  height: 100%;
  padding: var(--spacing-4, var(--spacing-4, 4px));
  display: block;
}

.IncodeIdFlipCardLayout .IncodeIdFlipCardLayoutContent .IncodeIdFlipCardBottomArea {
  z-index: 10;
  width: 100%;
  max-width: 384px;
  padding-top: var(--spacing-8, var(--spacing-8, 8px));
  flex-direction: column;
  flex: 1;
  align-items: center;
  display: flex;
}

.IncodeIdFlipCardLayout .IncodeIdFlipCardLayoutContent .IncodeIdFlipCardBottomArea .IncodeCaptureEncryptionLabel {
  justify-content: center;
  align-items: center;
  gap: var(--spacing-4, var(--spacing-4, 4px));
  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);
  white-space: nowrap;
  color: var(--color-text-body-primary, var(--text-body-800-primary));
  display: flex;
}

@keyframes incodeIdFlipCardFadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes incodeIdFlipCardRotate {
  from {
    transform: rotateY(0);
  }

  to {
    transform: rotateY(180deg);
  }
}

@keyframes incodeIdFlipCardFrontFade {
  0%, 20% {
    opacity: 1;
  }

  50%, 100% {
    opacity: 0;
  }
}

@keyframes incodeIdFlipCardReducedMotionFadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes incodeIdFlipCardReducedMotionFadeOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}

.IncodeCommonIssuesFullScreen .IncodeModalDialog {
  max-width: none;
  height: 100%;
  max-height: none;
}

.IncodeCommonIssuesFullScreen .IncodeModalContent {
  border-radius: var(--radius-none, var(--border-radius-none));
  max-width: none;
  height: 100%;
  margin: auto;
}

.IncodeCommonIssuesContent .IncodeCommonIssuesQuestionIcon {
  flex-shrink: 0;
}

.IncodeCommonIssuesContent .IncodeCommonIssuesTitle {
  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);
}

.IncodeCommonIssuesContent .IncodeCommonIssuesCards {
  gap: var(--spacing-32, var(--spacing-32, 32px));
  width: 100%;
  max-width: 420px;
  padding-block: var(--spacing-16, var(--spacing-16, 16px));
  flex-direction: column;
  display: flex;
}

.IncodeCommonIssuesContent .IncodeCommonIssuesCard {
  align-items: flex-start;
  gap: var(--spacing-16, var(--spacing-16, 16px));
  display: flex;
}

.IncodeCommonIssuesContent .IncodeCommonIssuesCardIcon {
  color: var(--color-text-body-primary, var(--text-body-800-primary));
  flex-shrink: 0;
}

.IncodeCommonIssuesContent .IncodeCommonIssuesCardText {
  gap: var(--spacing-4, var(--spacing-4, 4px));
  flex-direction: column;
  display: flex;
}

.IncodeCommonIssuesContent .IncodeCommonIssuesCardTitle {
  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);
}

.IncodeCommonIssuesContent .IncodeCommonIssuesCardBody {
  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);
  color: var(--color-text-body-secondary, var(--text-body-500-secondary));
}

.IncodeCommonIssuesContent .IncodeCommonIssuesButtons {
  margin-top: auto;
}

.IncodeCommonIssuesContent .IncodeCommonIssuesTakeManually {
  color: var(--color-text-body-primary, var(--text-body-800-primary));
}

.IncodeCommonIssuesContent .IncodeCommonIssuesTryAgain {
  width: 100%;
}

.IncodeChooserPage .IncodePageContent {
  padding-bottom: var(--spacing-16, var(--spacing-16, 16px));
}

.IncodeChooserPage .IncodePageTitle {
  max-width: 15.625rem;
}

.IncodeChooserPage .IncodeChooserContainer {
  flex-direction: column;
  align-items: center;
  width: 100%;
  margin-top: auto;
  display: flex;
}

.IncodeCaptureFrame {
  border-radius: var(--radius-medium, var(--border-radius-medium));
  --frame-border-color: var(--border-neutral-100);
  border: 4px solid var(--frame-border-color);
  justify-content: center;
  align-self: center;
  align-items: center;
  transition: max-width .3s ease-out, border-color .3s ease-out;
  display: flex;
  position: relative;
}

.IncodeCaptureFrame.IncodeCaptureFrameHorizontal {
  aspect-ratio: 35 / 22;
  width: 100%;
  max-width: 640px;
}

.IncodeCaptureFrame.IncodeCaptureFrameVertical {
  aspect-ratio: 22 / 35;
  width: 100%;
  max-width: 274px;
}

.IncodeCaptureFrame.IncodeCaptureFramePassport.IncodeCaptureFrameHorizontal {
  aspect-ratio: 42 / 30;
}

.IncodeCaptureFrame.IncodeCaptureFramePassport.IncodeCaptureFrameVertical {
  aspect-ratio: 30 / 42;
}

.IncodeCaptureFrame.IncodeCaptureFrameIdle {
  --frame-border-color: var(--border-neutral-100);
}

.IncodeCaptureFrame.IncodeCaptureFrameCapturing, .IncodeCaptureFrame.IncodeCaptureFrameFocus {
  --frame-border-color: var(--border-brand-500);
}

.IncodeCaptureFrame.IncodeCaptureFrameAnalyzing, .IncodeCaptureFrame.IncodeCaptureFrameSuccess {
  --frame-border-color: var(--border-status-positive-static);
}

.IncodeCaptureFrame.IncodeCaptureFrameError {
  --frame-border-color: var(--border-status-negative);
}

.IncodeIdCaptureStage {
  width: 100%;
  height: 100%;
  position: relative;
}

.IncodeIdCaptureStage > * {
  inset: var(--spacing-0, var(--spacing-none, 0px));
  position: absolute;
}

.IncodeIdCaptureStage > .IncodeIdCaptureStageResultExiting {
  animation: incodeIdCaptureResultCrossfadeOut var(--id-capture-result-crossfade-duration) linear forwards;
  pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {
  .IncodeIdCaptureStage > .IncodeIdCaptureStageResultExiting {
    animation-duration: 1ms;
  }
}

.IncodeIdCaptureStage > .IncodeIdCaptureStageResultEntering {
  animation: incodeIdCaptureResultCrossfadeIn var(--id-capture-result-crossfade-duration) linear forwards;
  pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {
  .IncodeIdCaptureStage > .IncodeIdCaptureStageResultEntering {
    animation-duration: 1ms;
  }
}

.IncodeIdCapturePage {
  background-color: var(--color-surface-neutral-900, var(--surface-neutral-900));
}

@media (min-width: 48rem) {
  .IncodeIdCapturePage {
    background-color: var(--color-black, #000);
  }
}

.IncodeIdCapturePage .IncodePageInner {
  padding: var(--spacing-0, var(--spacing-none, 0px));
}

.IncodeIdCapturePage .IncodePageContent {
  flex: 1;
  position: relative;
}

.IncodeIdCapturePage .IncodeCaptureInitializing {
  height: 100%;
  color: var(--color-text-body-0, var(--text-body-0-static));
  flex-direction: column;
  justify-content: center;
  align-items: center;
  display: flex;
}

.IncodeIdCapturePage .IncodeCaptureInitializing .IncodeCaptureVideo {
  pointer-events: none;
  inset: var(--spacing-0, var(--spacing-none, 0px));
  position: absolute;
}

.IncodeIdCapturePage .IncodeCaptureInitializing .IncodeCaptureVideo.IncodeCaptureVideoLoading {
  opacity: 0;
}

.IncodeIdCapturePage .IncodeCaptureInitializing .IncodeCaptureVideo .IncodeCaptureVideoElement {
  inset: var(--spacing-0, var(--spacing-none, 0px));
  object-fit: cover;
  width: 100%;
  max-width: 100%;
  height: 100%;
  position: absolute;
}

.IncodeIdCapturePage .IncodeCaptureInitializing .IncodeCaptureOverlay {
  pointer-events: none;
  justify-content: center;
  align-items: center;
  display: flex;
}

.IncodeIdCapturePage .IncodeCaptureInitializing .IncodeCaptureButton {
  border-radius: var(--radius-button-primary, var(--button-primary-border-radius));
  padding-inline: var(--spacing-24, var(--spacing-24, 24px));
  padding-block: var(--spacing-12, var(--spacing-12, 12px));
  background-color: var(--color-button-primary-surface-default, var(--button-primary-surface-default));
  color: var(--color-button-primary-text-default, var(--button-primary-text-default));
}

.IncodeIdCapturePage .IncodeCaptureInitializing .IncodeCaptureInitializing {
  height: 100%;
  color: var(--color-text-body-0, var(--text-body-0-static));
  flex-direction: column;
  justify-content: center;
  align-items: center;
  display: flex;
}

.IncodeIdCapturePage .IncodeCaptureInitializing .IncodeCaptureInitializing .IncodeCaptureInitializingText {
  margin-top: var(--spacing-16, var(--spacing-16, 16px));
}

.IncodeIdCapturePage .IncodeCaptureInitializing .IncodeCaptureUploading, .IncodeIdCapturePage .IncodeCaptureUploading {
  height: 100%;
  color: var(--color-text-body-0, var(--text-body-0-static));
  flex-direction: column;
  justify-content: center;
  align-items: center;
  display: flex;
}

@keyframes incodeIdCaptureResultCrossfadeOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}

@keyframes incodeIdCaptureResultCrossfadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.IncodeCaptureOverlayId {
  padding: var(--spacing-24, var(--spacing-24, 24px));
  align-items: center;
}

.IncodeCaptureOverlayId .IncodeCaptureTopSection {
  justify-content: flex-end;
  align-items: center;
  gap: var(--spacing-24, var(--spacing-24, 24px));
  padding-bottom: var(--spacing-40, var(--spacing-40, 40px));
  z-index: 10;
  flex-direction: column;
  flex: 1;
  display: flex;
}

.IncodeCaptureOverlayId .IncodeCaptureTopSection .IncodeCameraOverlayHeader {
  padding-inline: var(--spacing-16, var(--spacing-16, 16px));
  padding-top: var(--spacing-16, var(--spacing-16, 16px));
}

.IncodeCaptureOverlayId .IncodeCaptureFooter {
  flex: 1;
  justify-content: space-between;
}

.IncodeCaptureOverlayId .IncodeCaptureFooter .IncodeCaptureFooterCaptureSection {
  position: relative;
}

.IncodeCaptureOverlayId .IncodeCaptureFooter .IncodeIdManualCaptureTooltipContainer {
  pointer-events: none;
  z-index: 1000;
  --manual-capture-tooltip-button-gap: var(--spacing-4);
  --manual-capture-tooltip-button-top-offset: var(--spacing-12);
  --manual-capture-tooltip-button-center-offset: calc(var(--spacing-32) + var(--manual-capture-tooltip-button-gap));
  width: max-content;
  left: 50%;
  bottom: calc(100% - ( var(--manual-capture-tooltip-button-top-offset) - var(--manual-capture-tooltip-button-gap) ));
  justify-content: center;
  animation: .35s ease-in 3.5s forwards manualCaptureTooltipExit;
  display: flex;
  position: absolute;
  transform: translateX(-50%);
}

.IncodeCaptureOverlayId .IncodeCaptureFooter .IncodeIdManualCaptureTooltipContainer .IncodeIdManualCaptureTooltip {
  border-radius: var(--radius-medium, var(--border-radius-medium));
  background-color: var(--color-surface-neutral-900, var(--surface-neutral-900));
  padding: var(--spacing-16, var(--spacing-16, 16px));
  animation: .5s ease-out forwards slideUp;
}

.IncodeCaptureOverlayId .IncodeCaptureFooter .IncodeIdManualCaptureTooltipContainer .IncodeIdManualCaptureTooltip .IncodeIdManualCaptureTooltipList {
  margin: var(--spacing-0, var(--spacing-none, 0px));
  padding: var(--spacing-0, var(--spacing-none, 0px));
  flex-direction: column;
  align-items: center;
  list-style-type: none;
  display: flex;
}

.IncodeCaptureOverlayId .IncodeCaptureFooter .IncodeIdManualCaptureTooltipContainer .IncodeIdManualCaptureTooltip .IncodeIdManualCaptureTooltipList li {
  margin: var(--spacing-0, var(--spacing-none, 0px));
  font-family: var(--typography-tooltip-family);
  font-size: var(--typography-tooltip-m-size);
  font-weight: var(--typography-tooltip-m-weight);
  line-height: var(--typography-tooltip-m-line-height);
  letter-spacing: var(--typography-tooltip-m-letter-spacing);
  text-wrap: nowrap;
  color: var(--color-text-body-0-static, var(--text-body-0-static));
}

.IncodeCaptureOverlayId .IncodeCameraFrameHorizontal.IncodeCaptureFramePassport {
  aspect-ratio: 42 / 30;
}

.IncodeCaptureOverlayId .IncodeCameraFrameVertical.IncodeCaptureFramePassport {
  aspect-ratio: 30 / 42;
}

@keyframes manualCaptureTooltipExit {
  from {
    opacity: 1;
    transform: translateX(-50%);
  }

  to {
    opacity: 0;
    transform: translate(-50%, calc(50% + var(--manual-capture-tooltip-button-center-offset)));
  }
}

.IncodeIdManualCaptureButton {
  bottom: var(--spacing-24, var(--spacing-24, 24px));
  z-index: 100;
  --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);
  width: 100%;
  translate: var(--tw-translate-x) var(--tw-translate-y);
  justify-content: center;
  align-items: center;
  gap: var(--spacing-4, var(--spacing-4, 4px));
  flex-direction: column;
  animation: .5s ease-out forwards slideUp;
  display: flex;
  position: absolute;
  left: 50%;
}

.IncodeIdManualCaptureButton .IncodeButtonLink {
  height: 100%;
  padding: var(--spacing-0, var(--spacing-none, 0px));
  color: var(--color-text-body-primary, var(--text-body-800-primary));
}

.IncodeIdManualCaptureButton .IncodeIdManualCaptureTooltipContainer .IncodeIdManualCaptureTooltip {
  border-radius: var(--radius-medium, var(--border-radius-medium));
  background-color: var(--color-surface-neutral-900, var(--surface-neutral-900));
  padding: var(--spacing-16, var(--spacing-16, 16px));
}

.IncodeIdManualCaptureButton .IncodeIdManualCaptureTooltipContainer .IncodeIdManualCaptureTooltip .IncodeIdManualCaptureTooltipList {
  margin: var(--spacing-0, var(--spacing-none, 0px));
  padding: var(--spacing-0, var(--spacing-none, 0px));
  flex-direction: column;
  align-items: center;
  list-style-type: none;
  display: flex;
}

.IncodeIdManualCaptureButton .IncodeIdManualCaptureTooltipContainer .IncodeIdManualCaptureTooltip .IncodeIdManualCaptureTooltipList li {
  margin: var(--spacing-0, var(--spacing-none, 0px));
  font-family: var(--typography-tooltip-family);
  font-size: var(--typography-tooltip-m-size);
  font-weight: var(--typography-tooltip-m-weight);
  line-height: var(--typography-tooltip-m-line-height);
  letter-spacing: var(--typography-tooltip-m-letter-spacing);
  text-wrap: nowrap;
  color: var(--color-text-body-0-static, var(--text-body-0-static));
}

.IncodeIdManualCaptureButton .IncodeIdManualCaptureButtonContent .IncodeIdManualCaptureButtonButton svg {
  transition: filter .2s, transform .2s;
}

.IncodeIdManualCaptureButton .IncodeIdManualCaptureButtonContent:active svg {
  filter: brightness(.8);
  transform: scale(.95);
}

@keyframes slideUpAndDown {
  0%, 12% {
    opacity: 0;
    transform: translateY(100%);
  }

  24% {
    opacity: 1;
    transform: translateY(0);
  }

  76% {
    opacity: 1;
    transform: translateY(0);
  }

  88%, 100% {
    opacity: 0;
    transform: translateY(100%);
  }
}

.IncodeIdHint {
  inset: var(--spacing-0, var(--spacing-none, 0px));
  z-index: 10;
  justify-content: center;
  align-items: center;
  display: flex;
  position: absolute;
}

.IncodeIdHint .IncodeIdHintAnimated {
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  animation: 3s ease-in-out forwards slideUpAndDown;
  display: flex;
  position: relative;
}

.IncodeIdHint .IncodeIdHintAnimated .IncodeIdHintSvg {
  justify-content: center;
  align-items: center;
  display: flex;
}

.IncodeIdHint .IncodeIdHintAnimated .IncodeIdHintSvg svg {
  width: 800px;
  min-width: 800px;
  height: 800px;
  min-height: 800px;
}

.IncodeIdProcessingPage .IncodePageInner {
  padding: var(--spacing-0, var(--spacing-none, 0px));
}

.IncodeIdProcessingLayout {
  width: 100%;
  height: 100%;
  padding: var(--spacing-24, var(--spacing-24, 24px));
  background-color: var(--color-surface-neutral-0, var(--surface-neutral-0));
  flex-direction: column;
  justify-content: center;
  align-items: center;
  display: flex;
}

.IncodeIdProcessingLayout .IncodeIdProcessingLayoutContent {
  z-index: 10;
  flex-direction: column;
  align-items: center;
  width: 100%;
  height: 100%;
  display: flex;
}

.IncodeIdProcessingLayout .IncodeIdProcessingLayoutContent .IncodeIdProcessingTopArea {
  justify-content: flex-end;
  align-items: center;
  gap: var(--spacing-24, var(--spacing-24, 24px));
  padding-bottom: var(--spacing-40, var(--spacing-40, 40px));
  z-index: 10;
  flex-direction: column;
  flex: 1;
  width: 100%;
  display: flex;
}

.IncodeIdProcessingLayout .IncodeIdProcessingLayoutContent .IncodeCaptureFrame {
  overflow: hidden;
}

.IncodeIdProcessingLayout .IncodeIdProcessingLayoutContent .IncodeCaptureFrame.IncodeCaptureFrameVertical {
  width: clamp(180px, 30vh, 274px);
}

.IncodeIdProcessingLayout .IncodeIdProcessingLayoutContent .IncodeCaptureFrame.IncodeCaptureFrameVertical .IncodeIdProcessingOverlay {
  left: -25%;
  right: -25%;
}

.IncodeIdProcessingLayout .IncodeIdProcessingLayoutContent .IncodeCaptureFrame .IncodeIdProcessingImage {
  object-fit: cover;
  width: 100%;
  max-width: 100%;
  height: 100%;
  max-height: 100%;
}

.IncodeIdProcessingLayout .IncodeIdProcessingLayoutContent .IncodeCaptureFrame .IncodeIdProcessingImage.IncodeIdProcessingImageBlurred {
  filter: blur(var(--id-processing-image-blur-radius));
  -webkit-backdrop-filter: blur(var(--id-processing-image-blur-radius));
  backdrop-filter: blur(var(--id-processing-image-blur-radius));
}

.IncodeIdProcessingLayout .IncodeIdProcessingLayoutContent .IncodeCaptureFrame .IncodeIdProcessingOverlay {
  pointer-events: none;
  z-index: 10;
  justify-content: center;
  align-items: center;
  display: flex;
  position: absolute;
  inset: 0 -10%;
}

.IncodeIdProcessingLayout .IncodeIdProcessingLayoutContent .IncodeIdProcessingBottomArea {
  width: 100%;
  max-width: 384px;
  padding-top: var(--spacing-8, var(--spacing-8, 8px));
  z-index: 10;
  flex-direction: column;
  flex: 1;
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.IncodeIdProcessingLayout .IncodeIdProcessingLayoutContent .IncodeIdProcessingBottomArea .IncodeCaptureEncryptionLabel {
  justify-content: center;
  align-items: center;
  gap: var(--spacing-4, var(--spacing-4, 4px));
  padding-bottom: var(--spacing-12, var(--spacing-12, 12px));
  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);
  white-space: nowrap;
  color: var(--color-text-body-primary, var(--text-body-800-primary));
  display: flex;
}

.IncodeIdProcessingLayout.IncodeIdProcessingLayoutNoImage .IncodeIdProcessingBottomArea {
  justify-content: flex-end;
}

.IncodeIdProcessingLayout .IncodeAnalyzingContent {
  flex-direction: column;
  align-items: center;
  display: flex;
}

.IncodeIdProcessingLayout .IncodeAnalyzingContent .IncodeProgressBarContainer {
  margin-bottom: var(--spacing-24, var(--spacing-24, 24px));
}

.IncodeIdProcessingLayout .IncodeAnalyzingContent .IncodeAnalyzingTitle {
  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));
  text-align: center;
  min-height: var(--typography-headline-h2-line-height);
}

.IncodeIdProcessingLayout .IncodeAnalyzingContent .IncodeAnalyzingTitle .IncodeAnalyzingTitleText {
  animation: IncodeAnalyzingTitleFade var(--id-capture-analyzing-title-fade-duration) ease-out both;
  display: inline-block;
}

@media (prefers-reduced-motion: reduce) {
  .IncodeIdProcessingLayout .IncodeAnalyzingContent .IncodeAnalyzingTitle .IncodeAnalyzingTitleText {
    animation-duration: 1ms;
  }
}

.IncodeIdProcessingLayout .IncodeAnalyzingLottie {
  width: 100%;
  max-width: none;
}

@keyframes IncodeAnalyzingTitleFade {
  from {
    opacity: 0;
    transform: translateY(var(--id-capture-analyzing-title-fade-offset));
  }

  to {
    opacity: 1;
    transform: none;
  }
}

.IncodeIdProcessingLayout .IncodeIdProcessingResultContent {
  flex-direction: column;
  align-items: center;
  display: flex;
}

.IncodeIdProcessingLayout .IncodeIdProcessingResultTitle {
  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));
  text-align: center;
}

.IncodeIdProcessingLayout .IncodeIdProcessingResultSubtitle {
  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-secondary, var(--text-body-500-secondary));
  text-align: center;
  max-width: 300px;
}

.IncodeIdProcessingLayout .IncodeIdProcessingResultButtonContainer {
  margin-top: var(--spacing-24, var(--spacing-24, 24px));
  gap: var(--spacing-16, var(--spacing-16, 16px));
  flex-direction: column;
  width: 100%;
  display: flex;
}

.IncodeIdProcessingLayout .IncodeIdProcessingResultAttempts {
  padding-block: var(--spacing-12, var(--spacing-12, 12px));
  text-align: center;
  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));
}

.IncodeIdProcessingLayout .IncodeIdProcessingResultContentExiting, .IncodeIdProcessingLayout .IncodeIdProcessingResultButtonContainerExiting {
  animation: .3s ease-out forwards incodeIdProcessingResultFadeOut;
}

@media (prefers-reduced-motion: reduce) {
  .IncodeIdProcessingLayout .IncodeIdProcessingResultContentExiting, .IncodeIdProcessingLayout .IncodeIdProcessingResultButtonContainerExiting {
    animation-duration: 1ms;
  }
}

@keyframes incodeIdProcessingResultFadeOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}

.IncodeIdError {
  inset: var(--spacing-0, var(--spacing-none, 0px));
  z-index: 1000;
  justify-content: center;
  align-items: center;
  gap: var(--spacing-16, var(--spacing-16, 16px));
  flex-direction: column;
  width: 100%;
  height: 100%;
  display: flex;
  position: fixed;
}

.IncodeIdErrorMessage {
  text-align: center;
  font-size: var(--text-18, var(--primitive-typography-size-18));
  --tw-font-weight: var(--font-weight-medium, var(--primitive-typography-weight-medium));
  font-weight: var(--font-weight-medium, var(--primitive-typography-weight-medium));
  color: var(--color-text-body-0, var(--text-body-0-static));
  max-width: 350px;
  margin-bottom: var(--spacing-16, var(--spacing-16, 16px));
}

.IncodeIdNoAttemptsContent {
  padding-inline: var(--spacing-20, var(--spacing-20, 20px));
  flex-direction: column;
  flex: 1;
  justify-content: center;
  align-items: center;
  max-width: 800px;
  max-height: 840px;
  margin: auto;
  display: flex;
}

.IncodeIdNoAttemptsIcon {
  margin-bottom: var(--spacing-16, var(--spacing-16, 16px));
}

.IncodeIdNoAttemptsTitle {
  text-align: center;
  color: var(--color-text-body-primary, var(--text-body-800-primary));
}

.IncodeIdNoAttemptsSubtitle {
  font-size: var(--text-14, var(--primitive-typography-size-14));
  --tw-font-weight: var(--font-weight-normal, 400);
  font-weight: var(--font-weight-normal, 400);
  color: var(--color-text-body-secondary, var(--text-body-500-secondary));
  text-align: center;
  max-width: 350px;
}

.IncodeIdNoAttemptsButtonContainer {
  bottom: var(--spacing-32, var(--spacing-32, 32px));
  right: var(--spacing-0, var(--spacing-none, 0px));
  left: var(--spacing-0, var(--spacing-none, 0px));
  padding-inline: var(--spacing-24, var(--spacing-24, 24px));
  justify-content: center;
  display: flex;
  position: absolute;
}

.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));
  display: flex;
  overflow: hidden;
  box-shadow: 0 2.079px 36.379px #00000059;
}

.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;
}

.IncodeManualUploadPage .IncodeManualUploadContainer {
  width: 100%;
  padding-block: var(--spacing-24, var(--spacing-24, 24px));
  flex-direction: column;
  display: flex;
}

.IncodeManualUploadPage .IncodeManualUploadFooter {
  margin-top: auto;
  margin-bottom: var(--spacing-16, var(--spacing-16, 16px));
  row-gap: var(--spacing-24, var(--spacing-24, 24px));
  width: 100%;
  padding-top: var(--spacing-24, var(--spacing-24, 24px));
  flex-direction: column;
  display: flex;
}

.IncodeManualUploadPage .IncodeManualUploadHintCard {
  margin: var(--spacing-0, var(--spacing-none, 0px));
  border-radius: var(--radius-x-small, var(--border-radius-x-small));
  background-color: var(--color-surface-brand-50, var(--surface-brand-50));
  width: 100%;
  padding-block: var(--spacing-16, var(--spacing-16, 16px));
  padding-right: var(--spacing-12, var(--spacing-12, 12px));
  padding-left: var(--spacing-32, var(--spacing-32, 32px));
  color: var(--color-text-body-primary, var(--text-body-800-primary));
  list-style-type: disc;
}

.IncodeManualUploadPage .IncodeManualUploadHintCard li {
  font-family: var(--typography-button-family);
  font-size: var(--typography-button-s-size);
  font-weight: var(--typography-button-s-weight);
  line-height: var(--typography-button-s-line-height);
  letter-spacing: var(--typography-button-s-letter-spacing);
  color: var(--color-text-body-primary, var(--text-body-800-primary));
}

.IncodeManualUploadPage .IncodeManualUploadHintCard li + li {
  margin-top: var(--spacing-4, var(--spacing-4, 4px));
}

.IncodeManualUploadPage .IncodeManualUploadTabsList {
  width: 100%;
  padding-inline: var(--spacing-16, var(--spacing-16, 16px));
  align-self: center;
  display: flex;
}

.IncodeManualUploadPage .IncodeManualUploadTabTrigger {
  cursor: pointer;
  border-bottom-style: var(--tw-border-style);
  border-bottom-width: var(--border-width-bold, var(--primitive-border-width-2));
  --tw-border-style: solid;
  padding-inline: var(--spacing-12, var(--spacing-12, 12px));
  padding-block: var(--spacing-16, var(--spacing-16, 16px));
  text-align: center;
  font-family: var(--typography-checkbox-radio-family);
  font-size: var(--typography-checkbox-radio-m-size);
  font-weight: var(--typography-checkbox-radio-m-weight);
  line-height: var(--typography-checkbox-radio-m-line-height);
  letter-spacing: var(--typography-checkbox-radio-m-letter-spacing);
  color: var(--color-text-body-secondary, var(--text-body-500-secondary));
  background-color: #0000;
  border-style: solid;
  border-color: #0000;
  flex: 1;
}

.IncodeManualUploadPage .IncodeManualUploadTabTrigger:focus-visible {
  border-radius: var(--radius-xs, .125rem);
  outline-style: var(--tw-outline-style);
  outline-offset: 2px;
  outline-width: 2px;
  outline-color: var(--color-border-status-focus, var(--border-status-focus));
}

.IncodeManualUploadPage .IncodeManualUploadTabTrigger--active {
  border-bottom-color: var(--color-button-primary-surface-default, var(--button-primary-surface-default));
  color: var(--color-text-body-primary, var(--text-body-800-primary));
}

.IncodeManualUploadPage .IncodeManualUploadError {
  align-items: flex-start;
  gap: var(--spacing-4, var(--spacing-4, 4px));
  width: 100%;
  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);
  color: var(--color-input-text-helper-negative, var(--input-text-helper-negative));
  display: flex;
}

.IncodeManualUploadPage .IncodeManualUploadError p {
  margin: var(--spacing-0, var(--spacing-none, 0px));
  flex: 1;
}

.IncodeManualUploadPage .IncodeManualUploadTab {
  margin-top: var(--spacing-24, var(--spacing-24, 24px));
  margin-bottom: var(--spacing-16, var(--spacing-16, 16px));
  gap: var(--spacing-16, var(--spacing-16, 16px));
  flex-direction: column;
  width: 100%;
  display: flex;
}

.IncodeManualUploadSlot {
  cursor: pointer;
  align-items: center;
  gap: var(--spacing-12, var(--spacing-12, 12px));
  border-radius: var(--radius-medium, var(--border-radius-medium));
  border-style: var(--tw-border-style);
  border-width: var(--border-width-regular, var(--primitive-border-width-1));
  --tw-border-style: solid;
  border-style: solid;
  border-color: var(--color-border-neutral-100, var(--border-neutral-100));
  background-color: var(--color-surface-neutral-50, var(--surface-neutral-50));
  width: 100%;
  padding-block: var(--spacing-24, var(--spacing-24, 24px));
  padding-right: var(--spacing-24, var(--spacing-24, 24px));
  padding-left: var(--spacing-20, var(--spacing-20, 20px));
  text-align: left;
  display: flex;
}

.IncodeManualUploadSlot .IncodeManualUploadSlotIcon {
  width: var(--spacing-24, var(--spacing-24, 24px));
  height: var(--spacing-24, var(--spacing-24, 24px));
  flex-shrink: 0;
  justify-content: center;
  display: flex;
}

.IncodeManualUploadSlot .IncodeManualUploadSlotIconHighlight {
  fill: var(--color-icon-neutral-500, var(--icon-neutral-500));
}

.IncodeManualUploadSlot .IncodeManualUploadSlotLabel {
  text-overflow: ellipsis;
  white-space: nowrap;
  text-align: left;
  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-primary, var(--text-body-800-primary));
  flex: 1;
  overflow: hidden;
}

.IncodeManualUploadSlot .IncodeManualUploadSlotAction {
  border-radius: var(--radius-full, var(--border-radius-full));
  background-color: var(--color-button-primary-surface-default, var(--button-primary-surface-default));
  padding: var(--spacing-8, var(--spacing-8, 8px));
  color: var(--color-button-primary-text-default, var(--button-primary-text-default));
  transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
  transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));
  transition-duration: var(--tw-duration, var(--default-transition-duration, .15s));
  --tw-duration: .2s;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  transition-duration: .2s;
  display: inline-flex;
}

.IncodeManualUploadSlot:focus-visible {
  outline-style: var(--tw-outline-style);
  outline-offset: 2px;
  outline-width: 2px;
  outline-color: var(--color-border-status-focus, var(--border-status-focus));
}

.IncodeManualUploadSlot:hover:not(:disabled) .IncodeManualUploadSlotAction {
  background-color: var(--color-button-primary-surface-hover, var(--button-primary-surface-hover));
}

.IncodeManualUploadSlot:disabled {
  cursor: not-allowed;
  opacity: .5;
}

.IncodeManualUploadSlot:disabled .IncodeManualUploadSlotAction {
  background-color: var(--color-button-primary-surface-disabled, var(--button-primary-surface-disabled));
  color: var(--color-button-primary-text-disabled, var(--button-primary-text-disabled));
}

.IncodeManualUploadSlot.IncodeManualUploadSlot--uploaded .IncodeManualUploadSlotAction, .IncodeManualUploadSlot.IncodeManualUploadSlot--uploaded:hover:not(:disabled) .IncodeManualUploadSlotAction {
  padding: var(--spacing-0, var(--spacing-none, 0px));
  color: var(--color-surface-status-positive-500, var(--surface-status-positive-500));
  background-color: #0000;
}

.IncodeManualUploadSlot + .IncodeManualUploadSlotInput {
  clip-path: inset(50%);
  white-space: nowrap;
  border-width: 0;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  position: absolute;
  overflow: hidden;
}

.IncodeDigitalIdUploadPage {
  height: 100%;
}

.IncodeDigitalIdUploadPage .IncodeDigitalIdUploadBody {
  justify-content: center;
  align-items: center;
  row-gap: var(--spacing-16, var(--spacing-16, 16px));
  width: 100%;
  height: 100%;
  max-width: var(--digital-id-content-max-w);
  flex-direction: column;
  margin-inline: auto;
  display: flex;
}

.IncodeDigitalIdUploadPage .IncodeDigitalIdUploadPreviewBody {
  row-gap: var(--spacing-16, var(--spacing-16, 16px));
  grid-template-columns: 1fr;
  grid-template-rows: var(--spacing-24) var(--digital-id-preview-h) var(--spacing-24);
  width: 100%;
  height: 100%;
  max-width: var(--digital-id-content-max-w);
  align-content: center;
  justify-items: center;
  margin-inline: auto;
  display: grid;
}

.IncodeDigitalIdUploadPage .IncodeDigitalIdUploadPreStatusZone {
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  display: flex;
}

.IncodeDigitalIdUploadPage .IncodeDigitalIdUploadPostCaptionZone {
  justify-content: center;
  align-items: flex-start;
  width: 100%;
  height: 100%;
  display: flex;
}

.IncodeDigitalIdUploadPage .IncodeDigitalIdUploadFooter {
  width: 100%;
  margin-inline: auto;
  margin-top: var(--spacing-24, var(--spacing-24, 24px));
  margin-bottom: var(--spacing-8, var(--spacing-8, 8px));
  justify-content: flex-end;
  row-gap: var(--spacing-16, var(--spacing-16, 16px));
  max-width: var(--digital-id-content-max-w);
  min-height: var(--digital-id-footer-min-h);
  flex-direction: column;
  display: flex;
}

.IncodeDigitalIdUploadPage .IncodeDigitalIdUploadHiddenInput {
  display: none;
}

.IncodeDigitalIdUploadPage .IncodeDigitalIdUploadTutorialIllustration {
  width: 100%;
  max-height: var(--digital-id-tutorial-illustration-max-h);
  flex: 1;
  justify-content: center;
  align-items: center;
  display: flex;
  overflow: hidden;
}

.IncodeDigitalIdUploadPage .IncodeUploadIdScreenImage {
  height: var(--digital-id-illustration-max-h);
  aspect-ratio: 191 / 266;
  width: auto;
}

.IncodeDigitalIdUploadPage .IncodeDigitalIdUploadPreviewCard {
  border-radius: var(--radius-medium, var(--border-radius-medium));
  border-style: var(--tw-border-style);
  --tw-border-style: solid;
  border-style: solid;
  border-width: 1px;
  border-color: var(--color-border-neutral-100, var(--border-neutral-100));
  background-color: var(--color-surface-neutral-0, var(--surface-neutral-0));
  width: var(--digital-id-preview-w);
  height: var(--digital-id-preview-h);
  justify-content: center;
  align-items: center;
  display: flex;
  overflow: hidden;
}

.IncodeDigitalIdUploadPage .IncodeDigitalIdUploadDocumentPreview {
  width: var(--digital-id-preview-w);
  height: var(--digital-id-preview-h);
  justify-content: center;
  align-items: center;
  display: flex;
  position: relative;
  overflow: visible;
}

.IncodeDigitalIdUploadPage .IncodeDigitalIdUploadDocumentPreviewPdf {
  border-radius: var(--radius-medium, var(--border-radius-medium));
  border-style: var(--tw-border-style);
  border-width: var(--border-width-bold, var(--primitive-border-width-2));
  --tw-border-style: solid;
  border-style: solid;
  border-color: var(--color-border-status-positive, var(--border-status-positive-static));
  object-fit: contain;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.IncodeDigitalIdUploadPage .IncodeDigitalIdUploadPreviewPdf {
  object-fit: contain;
  width: 100%;
  height: 100%;
}

.IncodeDigitalIdUploadPage .IncodeDigitalIdUploadFileName {
  text-align: center;
  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);
  color: var(--color-text-body-primary, var(--text-body-800-primary));
  max-width: var(--digital-id-file-name-max-w);
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.IncodeDigitalIdUploadPage .IncodeDigitalIdUploadProgressBar .IncodeProgressBar {
  border-radius: var(--radius-full, var(--border-radius-full));
  background-color: var(--color-surface-neutral-200, var(--surface-neutral-200));
  width: var(--digital-id-progress-bar-w);
  height: var(--digital-id-progress-bar-h);
  overflow: hidden;
}

.IncodeDigitalIdUploadPage .IncodeDigitalIdUploadProgressBar .IncodeProgressBarFill {
  border-radius: var(--radius-full, var(--border-radius-full));
}

.IncodeDigitalIdUploadPage .IncodeDigitalIdUploadLaserOverlay {
  pointer-events: none;
  width: var(--digital-id-preview-w);
  height: var(--digital-id-laser-h);
  transform: translateX(-50%) scale(var(--digital-id-laser-scale));
  position: absolute;
  top: -2px;
  left: 50%;
}

@media (prefers-reduced-motion: reduce) {
  .IncodeDigitalIdUploadPage .IncodeDigitalIdUploadLaserOverlay {
    display: none;
  }
}

.IncodeDigitalIdUploadPage .IncodeDigitalIdUploadSuccessIcon {
  color: var(--color-icon-status-positive, var(--icon-status-positive));
  justify-content: center;
  align-items: center;
  display: flex;
}

.IncodeDigitalIdUploadPage .IncodeDigitalIdUploadErrorIcon {
  margin-bottom: var(--spacing-8, var(--spacing-8, 8px));
  color: var(--color-icon-status-negative, var(--icon-status-negative));
}

.IncodeDigitalIdUploadPage .IncodeDigitalIdUploadErrorPreview {
  margin-top: var(--spacing-8, var(--spacing-8, 8px));
  border-radius: var(--radius-medium, var(--border-radius-medium));
  border-style: var(--tw-border-style);
  --tw-border-style: solid;
  border-style: solid;
  border-width: 1px;
  border-color: var(--color-border-status-negative, var(--border-status-negative));
  padding: var(--spacing-4);
}

.IncodeDigitalIdUploadPage .IncodeDigitalIdUploadAttempts {
  margin-top: var(--spacing-8, var(--spacing-8, 8px));
  font-family: var(--typography-body-family);
  font-size: var(--typography-body-s-regular-size);
  font-weight: var(--typography-body-s-regular-weight);
  line-height: var(--typography-body-s-regular-line-height);
  letter-spacing: var(--typography-body-s-regular-letter-spacing);
  color: var(--color-text-body-secondary, var(--text-body-500-secondary));
}

@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-font-weight {
  syntax: "*";
  inherits: false
}

@property --tw-border-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}

@property --tw-outline-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}

@property --tw-duration {
  syntax: "*";
  inherits: false
}