@incodetech/web 0.0.0-dev-20260126-4504c5b

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (48) hide show
  1. package/dist/aligndevicelottie-DlQCRPfM.js +29 -0
  2. package/dist/backdevicelottie-B4NgyWmX.js +29 -0
  3. package/dist/base.css +1634 -0
  4. package/dist/baseTutorial-Be85FuyO.js +383 -0
  5. package/dist/blurdevicelottie-_BZRug1c.js +29 -0
  6. package/dist/browser-ponyfill-B6W6hHVY.js +344 -0
  7. package/dist/email/email.es.js +137 -0
  8. package/dist/email/styles.css +123 -0
  9. package/dist/flip-animation-COR596wy.js +29 -0
  10. package/dist/flow/flow.es.js +540 -0
  11. package/dist/flow/styles.css +3204 -0
  12. package/dist/frontdevicelottie-KhKxT5n9.js +29 -0
  13. package/dist/glaredevicelottie-DLuIStvb.js +29 -0
  14. package/dist/id/id.es.js +1497 -0
  15. package/dist/id/styles.css +1587 -0
  16. package/dist/id-laser-h-BBV3r3rz.js +29 -0
  17. package/dist/id-laser-v-BTHJaSfx.js +29 -0
  18. package/dist/id-tutorial-B-F5Q28m.js +29 -0
  19. package/dist/incodeModule-DR92HDjR.js +257 -0
  20. package/dist/index.es.js +6 -0
  21. package/dist/instance-B-q0ZREN.js +2140 -0
  22. package/dist/otpInput-Dm1LhnDm.js +151 -0
  23. package/dist/page-CITAo3qf.js +189 -0
  24. package/dist/passport-tutorial-CaYBFTqt.js +29 -0
  25. package/dist/phone/phone.es.js +3442 -0
  26. package/dist/phone/styles.css +305 -0
  27. package/dist/selfie/selfie.es.js +570 -0
  28. package/dist/selfie/styles.css +638 -0
  29. package/dist/selfieTutorial-Dm_p0ke9.js +29 -0
  30. package/dist/setup-BhetRn4n.js +20 -0
  31. package/dist/spinner-CQtj_FFo.js +65 -0
  32. package/dist/themes/dark.css +797 -0
  33. package/dist/themes/light.css +688 -0
  34. package/dist/types/base.d.ts +1 -0
  35. package/dist/types/dark.d.ts +1 -0
  36. package/dist/types/email.d.ts +57 -0
  37. package/dist/types/flow.d.ts +69 -0
  38. package/dist/types/id.d.ts +34 -0
  39. package/dist/types/index.d.ts +38 -0
  40. package/dist/types/light.d.ts +1 -0
  41. package/dist/types/phone.d.ts +58 -0
  42. package/dist/types/selfie.d.ts +31 -0
  43. package/dist/types/styles.d.ts +1 -0
  44. package/dist/types/themes/dark.d.ts +1 -0
  45. package/dist/types/themes/light.d.ts +1 -0
  46. package/dist/uiConfig-DEqynrWx.js +23 -0
  47. package/dist/vendor-preact-CjD4WiuC.js +593 -0
  48. package/package.json +100 -0
package/dist/flow/styles.css ADDED
@@ -0,0 +1,3204 @@
1
+ /*! tailwindcss v4.1.17 | MIT License | https://tailwindcss.com */
2
+ @layer properties {
3
+ @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
4
+ *, :before, :after, ::backdrop {
5
+ --tw-rotate-x: initial;
6
+ --tw-rotate-y: initial;
7
+ --tw-rotate-z: initial;
8
+ --tw-skew-x: initial;
9
+ --tw-skew-y: initial;
10
+ --tw-border-style: solid;
11
+ --tw-outline-style: solid;
12
+ --tw-blur: initial;
13
+ --tw-brightness: initial;
14
+ --tw-contrast: initial;
15
+ --tw-grayscale: initial;
16
+ --tw-hue-rotate: initial;
17
+ --tw-invert: initial;
18
+ --tw-opacity: initial;
19
+ --tw-saturate: initial;
20
+ --tw-sepia: initial;
21
+ --tw-drop-shadow: initial;
22
+ --tw-drop-shadow-color: initial;
23
+ --tw-drop-shadow-alpha: 100%;
24
+ --tw-drop-shadow-size: initial;
25
+ --tw-backdrop-blur: initial;
26
+ --tw-backdrop-brightness: initial;
27
+ --tw-backdrop-contrast: initial;
28
+ --tw-backdrop-grayscale: initial;
29
+ --tw-backdrop-hue-rotate: initial;
30
+ --tw-backdrop-invert: initial;
31
+ --tw-backdrop-opacity: initial;
32
+ --tw-backdrop-saturate: initial;
33
+ --tw-backdrop-sepia: initial;
34
+ --tw-ease: initial;
35
+ --tw-translate-x: 0;
36
+ --tw-translate-y: 0;
37
+ --tw-translate-z: 0;
38
+ --tw-leading: initial;
39
+ --tw-font-weight: initial;
40
+ --tw-tracking: initial;
41
+ --tw-duration: initial;
42
+ }
43
+ }
44
+ }
45
+
46
+ @layer incode-theme;
47
+
48
+ @layer incode-utilities {
49
+ .visible {
50
+ visibility: visible;
51
+ }
52
+
53
+ .absolute {
54
+ position: absolute;
55
+ }
56
+
57
+ .relative {
58
+ position: relative;
59
+ }
60
+
61
+ .container {
62
+ width: 100%;
63
+ }
64
+
65
+ @media (min-width: 40rem) {
66
+ .container {
67
+ max-width: 40rem;
68
+ }
69
+ }
70
+
71
+ @media (min-width: 48rem) {
72
+ .container {
73
+ max-width: 48rem;
74
+ }
75
+ }
76
+
77
+ @media (min-width: 64rem) {
78
+ .container {
79
+ max-width: 64rem;
80
+ }
81
+ }
82
+
83
+ @media (min-width: 80rem) {
84
+ .container {
85
+ max-width: 80rem;
86
+ }
87
+ }
88
+
89
+ @media (min-width: 96rem) {
90
+ .container {
91
+ max-width: 96rem;
92
+ }
93
+ }
94
+
95
+ .block {
96
+ display: block;
97
+ }
98
+
99
+ .flex {
100
+ display: flex;
101
+ }
102
+
103
+ .hidden {
104
+ display: none;
105
+ }
106
+
107
+ .inline-flex {
108
+ display: inline-flex;
109
+ }
110
+
111
+ .transform {
112
+ transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, );
113
+ }
114
+
115
+ .border {
116
+ border-style: var(--tw-border-style);
117
+ border-width: 1px;
118
+ }
119
+
120
+ .uppercase {
121
+ text-transform: uppercase;
122
+ }
123
+
124
+ .outline {
125
+ outline-style: var(--tw-outline-style);
126
+ outline-width: 1px;
127
+ }
128
+
129
+ .blur {
130
+ --tw-blur: blur(8px);
131
+ filter: var(--tw-blur, ) var(--tw-brightness, ) var(--tw-contrast, ) var(--tw-grayscale, ) var(--tw-hue-rotate, ) var(--tw-invert, ) var(--tw-saturate, ) var(--tw-sepia, ) var(--tw-drop-shadow, );
132
+ }
133
+
134
+ .filter {
135
+ filter: var(--tw-blur, ) var(--tw-brightness, ) var(--tw-contrast, ) var(--tw-grayscale, ) var(--tw-hue-rotate, ) var(--tw-invert, ) var(--tw-saturate, ) var(--tw-sepia, ) var(--tw-drop-shadow, );
136
+ }
137
+
138
+ .backdrop-filter {
139
+ -webkit-backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
140
+ backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
141
+ }
142
+
143
+ .transition {
144
+ transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
145
+ transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));
146
+ transition-duration: var(--tw-duration, var(--default-transition-duration, .15s));
147
+ }
148
+
149
+ .ease-in-out {
150
+ --tw-ease: var(--ease-in-out, cubic-bezier(.4, 0, .2, 1));
151
+ transition-timing-function: var(--ease-in-out, cubic-bezier(.4, 0, .2, 1));
152
+ }
153
+
154
+ .ease-out {
155
+ --tw-ease: var(--ease-out, cubic-bezier(0, 0, .2, 1));
156
+ transition-timing-function: var(--ease-out, cubic-bezier(0, 0, .2, 1));
157
+ }
158
+ }
159
+
160
+ @layer incode-base, incode-components;
161
+
162
+ @keyframes slideUp {
163
+ from {
164
+ transform: translateY(100%);
165
+ }
166
+
167
+ to {
168
+ transform: translateY(0);
169
+ }
170
+ }
171
+
172
+ .IncodeCameraButton {
173
+ justify-content: center;
174
+ align-items: center;
175
+ display: flex;
176
+ }
177
+
178
+ .IncodeCameraButton .IncodeCameraButtonPath {
179
+ fill: var(--color-border-brand-500, var(--border-brand-500-static));
180
+ }
181
+
182
+ .IncodeCameraButton .IncodeCameraButtonBackground {
183
+ fill: var(--color-surface-brand-50, var(--surface-brand-50));
184
+ }
185
+
186
+ .IncodeCaptureContainer {
187
+ flex-direction: column;
188
+ flex: 1;
189
+ justify-content: flex-start;
190
+ align-items: center;
191
+ height: 100%;
192
+ display: flex;
193
+ position: relative;
194
+ overflow: hidden;
195
+ }
196
+
197
+ .IncodeCaptureContainer .IncodeCaptureFrame {
198
+ aspect-ratio: 1;
199
+ border-radius: var(--radius-full, var(--border-radius-full));
200
+ border-style: var(--tw-border-style);
201
+ border-width: 12px;
202
+ border-color: #0000;
203
+ width: 100%;
204
+ max-width: 335px;
205
+ position: relative;
206
+ }
207
+
208
+ .IncodeCaptureContainer .IncodeCaptureVideoWrapper {
209
+ --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);
210
+ --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
211
+ width: calc(100% - 24px);
212
+ height: calc(100% - 24px);
213
+ translate: var(--tw-translate-x) var(--tw-translate-y);
214
+ transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, );
215
+ border-radius: var(--radius-full, var(--border-radius-full));
216
+ background-color: var(--color-white, #fff);
217
+ justify-content: center;
218
+ align-items: center;
219
+ display: flex;
220
+ position: absolute;
221
+ top: 50%;
222
+ left: 50%;
223
+ overflow: hidden;
224
+ }
225
+
226
+ .IncodeCaptureContainer .IncodeCaptureVideo {
227
+ z-index: 50;
228
+ width: 100%;
229
+ height: 100%;
230
+ position: absolute;
231
+ }
232
+
233
+ .IncodeCaptureContainer .IncodeCaptureVideoElement {
234
+ object-fit: cover;
235
+ width: 100%;
236
+ height: 100%;
237
+ position: absolute;
238
+ transform: scaleX(-1);
239
+ }
240
+
241
+ .IncodeCaptureUploadingPage .IncodeCaptureUploadingContainer {
242
+ flex-direction: column;
243
+ flex: 1;
244
+ animation: .4s ease-out fadeInScale;
245
+ display: flex;
246
+ }
247
+
248
+ .IncodeCaptureUploadingPage .IncodeCaptureUploadingTitle {
249
+ text-align: center;
250
+ font-size: var(--text-2xl, 1.5rem);
251
+ line-height: var(--tw-leading, var(--text-2xl--line-height, calc(2 / 1.5)));
252
+ --tw-leading: 125%;
253
+ --tw-font-weight: var(--font-weight-bold, var(--primitive-typography-weight-bold));
254
+ line-height: 125%;
255
+ font-weight: var(--font-weight-bold, var(--primitive-typography-weight-bold));
256
+ --tw-tracking: -1px;
257
+ letter-spacing: -1px;
258
+ color: var(--color-text-body-primary, var(--text-body-primary));
259
+ }
260
+
261
+ .IncodeCaptureUploadingPage .IncodeCaptureUploadingPrimaryIcon {
262
+ fill: var(--color-spinner-surface-primary, var(--spinner-surface-primary));
263
+ }
264
+
265
+ .IncodeCaptureUploadingPage .IncodeCaptureUploadingSecondaryIcon {
266
+ fill: var(--color-spinner-surface-secondary, var(--spinner-surface-secondary));
267
+ }
268
+
269
+ @keyframes fadeInScale {
270
+ from {
271
+ opacity: 0;
272
+ transform: scale(.95);
273
+ }
274
+
275
+ to {
276
+ opacity: 1;
277
+ transform: scale(1);
278
+ }
279
+ }
280
+
281
+ .IncodeCaptureSuccessPage .IncodeCaptureSuccessContainer {
282
+ flex-direction: column;
283
+ flex: 1;
284
+ align-items: center;
285
+ display: flex;
286
+ }
287
+
288
+ .IncodeErrorModalContent {
289
+ inset: var(--spacing-0, var(--spacing-none, 0px));
290
+ top: var(--spacing-0, var(--spacing-none, 0px));
291
+ right: var(--spacing-0, var(--spacing-none, 0px));
292
+ bottom: var(--spacing-0, var(--spacing-none, 0px));
293
+ left: var(--spacing-0, var(--spacing-none, 0px));
294
+ z-index: 50;
295
+ background-color: var(--color-white, #fff);
296
+ justify-content: center;
297
+ align-items: center;
298
+ width: 100%;
299
+ height: 100%;
300
+ display: flex;
301
+ position: fixed;
302
+ }
303
+
304
+ .IncodeErrorModalContent .IncodeErrorModalContentContainer {
305
+ width: 100%;
306
+ min-width: 320px;
307
+ height: 100%;
308
+ padding-inline: var(--spacing-16, var(--spacing-16, 16px));
309
+ flex-direction: column;
310
+ justify-content: center;
311
+ align-items: center;
312
+ display: flex;
313
+ }
314
+
315
+ .IncodeErrorModalContent .IncodeErrorModalContentSpacer {
316
+ flex: 1;
317
+ }
318
+
319
+ .IncodeErrorModalContent .IncodeErrorModalContentIconContainer {
320
+ flex-direction: column;
321
+ flex: 1;
322
+ justify-content: center;
323
+ align-items: center;
324
+ display: flex;
325
+ }
326
+
327
+ .IncodeErrorModalContent .IncodeErrorModalContentTitle {
328
+ text-align: center;
329
+ font-size: var(--text-2xl, 1.5rem);
330
+ line-height: var(--tw-leading, var(--text-2xl--line-height, calc(2 / 1.5)));
331
+ --tw-leading: 114%;
332
+ --tw-font-weight: var(--font-weight-bold, var(--primitive-typography-weight-bold));
333
+ line-height: 114%;
334
+ font-weight: var(--font-weight-bold, var(--primitive-typography-weight-bold));
335
+ --tw-tracking: -.5px;
336
+ letter-spacing: -.5px;
337
+ color: var(--color-text-body-primary, var(--text-body-primary));
338
+ }
339
+
340
+ .IncodeErrorModalContent .IncodeErrorModalContentDescription {
341
+ text-align: center;
342
+ font-size: var(--text-base, 1rem);
343
+ line-height: var(--tw-leading, var(--text-base--line-height, calc(1.5 / 1)));
344
+ --tw-leading: 114%;
345
+ --tw-font-weight: var(--font-weight-medium, var(--primitive-typography-weight-medium));
346
+ line-height: 114%;
347
+ font-weight: var(--font-weight-medium, var(--primitive-typography-weight-medium));
348
+ --tw-tracking: -.5px;
349
+ letter-spacing: -.5px;
350
+ color: var(--color-text-body-secondary, var(--text-body-secondary));
351
+ }
352
+
353
+ .IncodeErrorModalContent .IncodeErrorModalContentAttemptsContainer {
354
+ flex-direction: column;
355
+ align-items: center;
356
+ width: 100%;
357
+ display: flex;
358
+ }
359
+
360
+ .IncodeErrorModalContent .IncodeErrorModalContentAttemptsText {
361
+ text-align: center;
362
+ font-family: var(--primitive-typography-family-dm-sans);
363
+ font-size: var(--typography-body-lg-size);
364
+ font-weight: var(--typography-body-lg-weight);
365
+ line-height: var(--typography-body-lg-line-height);
366
+ letter-spacing: var(--typography-body-lg-letter-spacing);
367
+ font-size: var(--text-lg, 1.125rem);
368
+ line-height: var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));
369
+ --tw-leading: 114%;
370
+ --tw-font-weight: var(--font-weight-medium, var(--primitive-typography-weight-medium));
371
+ line-height: 114%;
372
+ font-weight: var(--font-weight-medium, var(--primitive-typography-weight-medium));
373
+ --tw-tracking: -.5px;
374
+ letter-spacing: -.5px;
375
+ color: var(--color-text-body-secondary, var(--text-body-secondary));
376
+ }
377
+
378
+ .IncodeFaceOutline {
379
+ height: 100%;
380
+ }
381
+
382
+ .IncodeLoadingBorder {
383
+ aspect-ratio: 1;
384
+ width: 100%;
385
+ max-width: 335px;
386
+ position: absolute;
387
+ }
388
+
389
+ .IncodeLoadingBorder.IncodeLoadingBorderSpinning {
390
+ animation: var(--animate-spin, spin 1s linear infinite);
391
+ }
392
+
393
+ .IncodeLoadingBorder .IncodeLoadingBorderPath {
394
+ transition: all 1s ease-in-out;
395
+ }
396
+
397
+ .IncodeManualCaptureButton {
398
+ align-items: center;
399
+ gap: var(--spacing-16, var(--spacing-16, 16px));
400
+ flex-direction: column;
401
+ max-width: 275px;
402
+ display: flex;
403
+ }
404
+
405
+ .IncodeManualCaptureButtonText {
406
+ text-align: center;
407
+ font-size: var(--text-base, 1rem);
408
+ line-height: var(--tw-leading, var(--text-base--line-height, calc(1.5 / 1)));
409
+ --tw-leading: 1.14;
410
+ --tw-font-weight: var(--font-weight-medium, var(--primitive-typography-weight-medium));
411
+ line-height: 1.14;
412
+ font-weight: var(--font-weight-medium, var(--primitive-typography-weight-medium));
413
+ color: var(--color-text-body-primary, var(--text-body-primary));
414
+ }
415
+
416
+ .IncodeManualCaptureButtonButton {
417
+ padding: var(--spacing-0, var(--spacing-none, 0px));
418
+ }
419
+
420
+ .IncodeNotification {
421
+ flex-direction: column;
422
+ align-items: center;
423
+ display: flex;
424
+ }
425
+
426
+ .IncodeNotificationText {
427
+ text-align: center;
428
+ font-size: var(--text-2xl, 1.5rem);
429
+ line-height: var(--tw-leading, var(--text-2xl--line-height, calc(2 / 1.5)));
430
+ --tw-leading: 1.2;
431
+ --tw-font-weight: var(--font-weight-bold, var(--primitive-typography-weight-bold));
432
+ line-height: 1.2;
433
+ font-weight: var(--font-weight-bold, var(--primitive-typography-weight-bold));
434
+ color: var(--color-text-body-primary, var(--text-body-primary));
435
+ }
436
+
437
+ .IncodeSelfieTutorial {
438
+ --brand-color: var(--surface-brand-500);
439
+ }
440
+
441
+ .IncodeSelfieTutorial .IncodeBaseTutorialAnimation svg linearGradient#__lottie_element_29 stop {
442
+ stop-color: var(--brand-color);
443
+ }
444
+
445
+ .IncodeSelfieTutorial .IncodeBaseTutorialAnimation svg > g > g > g:first-child > g:first-child > g > g > g:nth-child(2) > g:nth-child(3) > g > path, .IncodeSelfieTutorial .IncodeBaseTutorialAnimation svg > g > g > g:first-child > g:first-child > g > g > g:nth-child(2) > g:first-child > g > path {
446
+ fill: var(--brand-color);
447
+ }
448
+
449
+ .IncodePhonePage .IncodePageContent {
450
+ padding-top: var(--spacing-32, var(--spacing-32, 32px));
451
+ padding-bottom: var(--spacing-16, var(--spacing-16, 16px));
452
+ }
453
+
454
+ .IncodePhonePage .IncodePhoneInput, .IncodePhonePage .IncodePhoneInputContainer {
455
+ flex-direction: column;
456
+ align-items: center;
457
+ width: 100%;
458
+ display: flex;
459
+ }
460
+
461
+ .IncodePhonePage .IncodePhoneInputRow {
462
+ align-items: stretch;
463
+ gap: var(--spacing-8, var(--spacing-8, 8px));
464
+ width: 100%;
465
+ max-width: 340px;
466
+ display: flex;
467
+ position: relative;
468
+ }
469
+
470
+ .IncodePhonePage .IncodePhoneInputWrapper {
471
+ border-radius: var(--radius-small, var(--border-radius-small));
472
+ border-style: var(--tw-border-style);
473
+ border-width: 1px;
474
+ border-color: var(--color-input-border-default, var(--input-border-default));
475
+ background-color: var(--color-input-surface-default, var(--input-surface-default));
476
+ transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
477
+ transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));
478
+ transition-duration: var(--tw-duration, var(--default-transition-duration, .15s));
479
+ --tw-duration: .2s;
480
+ flex: 1;
481
+ align-items: center;
482
+ transition-duration: .2s;
483
+ display: flex;
484
+ }
485
+
486
+ .IncodePhonePage .IncodePhoneInputWrapper:focus-within {
487
+ border-color: var(--color-input-border-active, var(--input-border-active));
488
+ }
489
+
490
+ .IncodePhonePage .IncodePhoneInputWrapper.IncodePhoneInputWrapperError {
491
+ border-color: var(--color-input-border-negative, var(--input-border-negative));
492
+ }
493
+
494
+ .IncodePhonePage .IncodePhoneInputWrapper.IncodePhoneInputWrapperDisabled {
495
+ border-color: var(--color-input-border-disabled, var(--input-border-disabled));
496
+ background-color: var(--color-input-surface-disabled, var(--input-surface-disabled));
497
+ }
498
+
499
+ .IncodePhonePage .IncodePhoneCountrySelector {
500
+ border-radius: var(--radius-small, var(--border-radius-small));
501
+ border-style: var(--tw-border-style);
502
+ border-width: 1px;
503
+ border-color: var(--color-input-border-default, var(--input-border-default));
504
+ background-color: var(--color-input-surface-default, var(--input-surface-default));
505
+ width: 124px;
506
+ transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
507
+ transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));
508
+ transition-duration: var(--tw-duration, var(--default-transition-duration, .15s));
509
+ --tw-duration: .2s;
510
+ flex-shrink: 0;
511
+ transition-duration: .2s;
512
+ position: static;
513
+ }
514
+
515
+ .IncodePhonePage .IncodePhoneCountrySelector.IncodePhoneCountrySelectorOpen {
516
+ border-color: var(--color-input-border-active, var(--input-border-active));
517
+ }
518
+
519
+ .IncodePhonePage .IncodePhoneCountrySelector.IncodePhoneCountrySelectorDisabled {
520
+ border-color: var(--color-input-border-disabled, var(--input-border-disabled));
521
+ background-color: var(--color-input-surface-disabled, var(--input-surface-disabled));
522
+ }
523
+
524
+ .IncodePhonePage .IncodePhoneCountryButton {
525
+ width: 100%;
526
+ height: 100%;
527
+ padding: var(--spacing-8, var(--spacing-8, 8px));
528
+ padding-left: var(--spacing-16, var(--spacing-16, 16px));
529
+ cursor: pointer;
530
+ border-style: var(--tw-border-style);
531
+ border-width: var(--border-width-none, var(--border-none));
532
+ --tw-border-style: none;
533
+ font-size: var(--text-18, var(--primitive-typography-size-18));
534
+ --tw-font-weight: var(--font-weight-medium, var(--primitive-typography-weight-medium));
535
+ font-weight: var(--font-weight-medium, var(--primitive-typography-weight-medium));
536
+ color: var(--color-text-body-primary, var(--text-body-primary));
537
+ border-radius: var(--radius-small, var(--border-radius-small));
538
+ background-color: #0000;
539
+ border-style: none;
540
+ justify-content: center;
541
+ align-items: center;
542
+ font-family: inherit;
543
+ display: flex;
544
+ }
545
+
546
+ .IncodePhonePage .IncodePhoneCountryButton:disabled {
547
+ cursor: not-allowed;
548
+ color: var(--color-input-text-field-disabled, var(--input-text-field-disabled));
549
+ }
550
+
551
+ .IncodePhonePage .IncodePhoneCountryButton:focus {
552
+ --tw-outline-style: none;
553
+ outline-style: none;
554
+ }
555
+
556
+ .IncodePhonePage .IncodePhoneCountryFlag {
557
+ font-size: var(--text-24, var(--primitive-typography-size-24));
558
+ --tw-leading: 1;
559
+ line-height: 1;
560
+ }
561
+
562
+ .IncodePhonePage .IncodePhoneCountryCode {
563
+ margin-left: var(--spacing-4, var(--spacing-4, 4px));
564
+ font-size: var(--text-18, var(--primitive-typography-size-18));
565
+ --tw-font-weight: var(--font-weight-medium, var(--primitive-typography-weight-medium));
566
+ font-weight: var(--font-weight-medium, var(--primitive-typography-weight-medium));
567
+ white-space: nowrap;
568
+ color: var(--color-text-body-primary, var(--text-body-primary));
569
+ }
570
+
571
+ .IncodePhonePage .IncodePhoneCountryArrow {
572
+ margin-left: var(--spacing-8, var(--spacing-8, 8px));
573
+ height: var(--spacing-24, var(--spacing-24, 24px));
574
+ width: var(--spacing-24, var(--spacing-24, 24px));
575
+ color: var(--color-icon-neutral-500, var(--icon-neutral-500));
576
+ transition-property: transform, translate, scale, rotate;
577
+ transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));
578
+ transition-duration: var(--tw-duration, var(--default-transition-duration, .15s));
579
+ --tw-duration: .2s;
580
+ transition-duration: .2s;
581
+ }
582
+
583
+ .IncodePhonePage .IncodePhoneCountryArrowUp {
584
+ rotate: 180deg;
585
+ }
586
+
587
+ .IncodePhonePage .IncodePhoneCountryButton:disabled .IncodePhoneCountryArrow {
588
+ color: var(--color-icon-neutral-300, var(--icon-neutral-300));
589
+ }
590
+
591
+ .IncodePhonePage .IncodePhoneCountryDropdown {
592
+ top: 100%;
593
+ right: var(--spacing-0, var(--spacing-none, 0px));
594
+ left: var(--spacing-0, var(--spacing-none, 0px));
595
+ z-index: 50;
596
+ margin-top: var(--spacing-8, var(--spacing-8, 8px));
597
+ border-radius: var(--radius-small, var(--border-radius-small));
598
+ border-style: var(--tw-border-style);
599
+ border-width: 1px;
600
+ border-color: var(--color-input-border-default, var(--input-border-default));
601
+ background-color: var(--color-surface-neutral-0, var(--surface-neutral-0));
602
+ max-height: 320px;
603
+ padding: var(--spacing-8, var(--spacing-8, 8px));
604
+ position: absolute;
605
+ overflow-y: auto;
606
+ box-shadow: 0 4px 16px #0000001f;
607
+ }
608
+
609
+ .IncodePhonePage .IncodePhoneCountryOption {
610
+ cursor: pointer;
611
+ align-items: center;
612
+ gap: var(--spacing-12, var(--spacing-12, 12px));
613
+ border-radius: var(--radius-small, var(--border-radius-small));
614
+ width: 100%;
615
+ padding-inline: var(--spacing-12, var(--spacing-12, 12px));
616
+ padding-block: var(--spacing-12, var(--spacing-12, 12px));
617
+ font-size: var(--text-16, var(--primitive-typography-size-16));
618
+ --tw-font-weight: var(--font-weight-medium, var(--primitive-typography-weight-medium));
619
+ font-weight: var(--font-weight-medium, var(--primitive-typography-weight-medium));
620
+ color: var(--color-text-body-primary, var(--text-body-primary));
621
+ border-style: var(--tw-border-style);
622
+ border-width: var(--border-width-none, var(--border-none));
623
+ --tw-border-style: none;
624
+ text-align: left;
625
+ background-color: #0000;
626
+ border-style: none;
627
+ font-family: inherit;
628
+ display: flex;
629
+ }
630
+
631
+ .IncodePhonePage .IncodePhoneCountryOption:hover {
632
+ background-color: var(--color-surface-neutral-100, var(--surface-neutral-100));
633
+ }
634
+
635
+ .IncodePhonePage .IncodePhoneCountryOption:focus {
636
+ background-color: var(--color-surface-neutral-100, var(--surface-neutral-100));
637
+ --tw-outline-style: none;
638
+ outline-style: none;
639
+ }
640
+
641
+ .IncodePhonePage .IncodePhoneCountryOptionSelected, .IncodePhonePage .IncodePhoneCountryOptionSelected:hover {
642
+ background-color: var(--color-surface-brand-50, var(--surface-brand-50));
643
+ }
644
+
645
+ .IncodePhonePage .IncodePhoneCountryOptionCode {
646
+ min-width: 52px;
647
+ font-size: var(--text-16, var(--primitive-typography-size-16));
648
+ color: var(--color-text-body-secondary, var(--text-body-secondary));
649
+ }
650
+
651
+ .IncodePhonePage .IncodePhoneCountryOptionName {
652
+ text-overflow: ellipsis;
653
+ white-space: nowrap;
654
+ font-size: var(--text-16, var(--primitive-typography-size-16));
655
+ color: var(--color-text-body-primary, var(--text-body-primary));
656
+ flex: 1;
657
+ overflow: hidden;
658
+ }
659
+
660
+ .IncodePhonePage .IncodePhoneInputField {
661
+ border-style: var(--tw-border-style);
662
+ border-width: var(--border-width-none, var(--border-none));
663
+ --tw-border-style: none;
664
+ width: 100%;
665
+ padding-inline: var(--spacing-16, var(--spacing-16, 16px));
666
+ padding-block: var(--spacing-16, var(--spacing-16, 16px));
667
+ font-size: var(--text-18, var(--primitive-typography-size-18));
668
+ --tw-font-weight: var(--font-weight-medium, var(--primitive-typography-weight-medium));
669
+ font-weight: var(--font-weight-medium, var(--primitive-typography-weight-medium));
670
+ color: var(--color-input-text-field-default, var(--input-text-field-default));
671
+ --tw-outline-style: none;
672
+ border-radius: var(--radius-small, var(--border-radius-small));
673
+ background-color: #0000;
674
+ border-style: none;
675
+ outline-style: none;
676
+ }
677
+
678
+ .IncodePhonePage .IncodePhoneInputField::placeholder {
679
+ --tw-font-weight: var(--font-weight-medium, var(--primitive-typography-weight-medium));
680
+ font-weight: var(--font-weight-medium, var(--primitive-typography-weight-medium));
681
+ color: var(--color-input-text-field-placeholder, var(--input-text-field-placeholder));
682
+ }
683
+
684
+ .IncodePhonePage .IncodePhoneInputField:disabled {
685
+ cursor: not-allowed;
686
+ color: var(--color-input-text-field-disabled, var(--input-text-field-disabled));
687
+ }
688
+
689
+ .IncodePhonePage .IncodePhoneInputError {
690
+ margin: var(--spacing-0, var(--spacing-none, 0px));
691
+ text-align: center;
692
+ font-size: var(--text-14, var(--primitive-typography-size-14));
693
+ --tw-font-weight: var(--font-weight-medium, var(--primitive-typography-weight-medium));
694
+ font-weight: var(--font-weight-medium, var(--primitive-typography-weight-medium));
695
+ color: var(--color-input-text-helper-negative, var(--input-text-helper-negative));
696
+ }
697
+
698
+ .IncodePhonePage .IncodePhoneInputOptIn {
699
+ cursor: pointer;
700
+ align-items: center;
701
+ gap: var(--spacing-8, var(--spacing-8, 8px));
702
+ font-size: var(--text-14, var(--primitive-typography-size-14));
703
+ color: var(--color-checkbox-text-default, var(--checkbox-text-default));
704
+ display: flex;
705
+ }
706
+
707
+ .IncodePhonePage .IncodePhoneInputOptIn input[type="checkbox"] {
708
+ cursor: pointer;
709
+ border-radius: var(--radius-checkbox, var(--checkbox-border-radius));
710
+ width: 18px;
711
+ height: 18px;
712
+ accent-color: var(--color-checkbox-surface-selected, var(--checkbox-surface-selected));
713
+ }
714
+
715
+ .IncodePhonePage .IncodePhoneInputOptIn span {
716
+ --tw-font-weight: var(--font-weight-medium, var(--primitive-typography-weight-medium));
717
+ font-weight: var(--font-weight-medium, var(--primitive-typography-weight-medium));
718
+ -webkit-user-select: none;
719
+ user-select: none;
720
+ }
721
+
722
+ .IncodeEmailPage .IncodePageContent {
723
+ padding-top: var(--spacing-32, var(--spacing-32, 32px));
724
+ padding-bottom: var(--spacing-16, var(--spacing-16, 16px));
725
+ }
726
+
727
+ .IncodeEmailPage .IncodeEmailInput, .IncodeEmailPage .IncodeEmailInputContainer {
728
+ flex-direction: column;
729
+ align-items: center;
730
+ width: 100%;
731
+ display: flex;
732
+ }
733
+
734
+ .IncodeEmailPage .IncodeEmailInputWrapper {
735
+ border-radius: var(--radius-small, var(--border-radius-small));
736
+ border-style: var(--tw-border-style);
737
+ border-width: 1px;
738
+ border-color: var(--color-input-border-default, var(--input-border-default));
739
+ background-color: var(--color-input-surface-default, var(--input-surface-default));
740
+ width: 100%;
741
+ max-width: 340px;
742
+ transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
743
+ transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));
744
+ transition-duration: var(--tw-duration, var(--default-transition-duration, .15s));
745
+ --tw-duration: .2s;
746
+ flex-direction: column;
747
+ transition-duration: .2s;
748
+ display: flex;
749
+ }
750
+
751
+ .IncodeEmailPage .IncodeEmailInputWrapper:focus-within {
752
+ border-color: var(--color-input-border-active, var(--input-border-active));
753
+ }
754
+
755
+ .IncodeEmailPage .IncodeEmailInputWrapper.IncodeEmailInputWrapperError {
756
+ border-color: var(--color-input-border-negative, var(--input-border-negative));
757
+ }
758
+
759
+ .IncodeEmailPage .IncodeEmailInputWrapper.IncodeEmailInputWrapperDisabled {
760
+ border-color: var(--color-input-border-disabled, var(--input-border-disabled));
761
+ background-color: var(--color-input-surface-disabled, var(--input-surface-disabled));
762
+ }
763
+
764
+ .IncodeEmailPage .IncodeEmailInputLabel {
765
+ clip-path: inset(50%);
766
+ white-space: nowrap;
767
+ border-width: 0;
768
+ width: 1px;
769
+ height: 1px;
770
+ margin: -1px;
771
+ padding: 0;
772
+ position: absolute;
773
+ overflow: hidden;
774
+ }
775
+
776
+ .IncodeEmailPage .IncodeEmailInputField {
777
+ border-style: var(--tw-border-style);
778
+ border-width: var(--border-width-none, var(--border-none));
779
+ --tw-border-style: none;
780
+ width: 100%;
781
+ padding-inline: var(--spacing-16, var(--spacing-16, 16px));
782
+ padding-block: var(--spacing-16, var(--spacing-16, 16px));
783
+ font-size: var(--text-18, var(--primitive-typography-size-18));
784
+ --tw-font-weight: var(--font-weight-medium, var(--primitive-typography-weight-medium));
785
+ font-weight: var(--font-weight-medium, var(--primitive-typography-weight-medium));
786
+ color: var(--color-input-text-field-default, var(--input-text-field-default));
787
+ --tw-outline-style: none;
788
+ border-radius: var(--radius-small, var(--border-radius-small));
789
+ background-color: #0000;
790
+ border-style: none;
791
+ outline-style: none;
792
+ }
793
+
794
+ .IncodeEmailPage .IncodeEmailInputField::placeholder {
795
+ --tw-font-weight: var(--font-weight-medium, var(--primitive-typography-weight-medium));
796
+ font-weight: var(--font-weight-medium, var(--primitive-typography-weight-medium));
797
+ color: var(--color-input-text-field-placeholder, var(--input-text-field-placeholder));
798
+ }
799
+
800
+ .IncodeEmailPage .IncodeEmailInputField:disabled {
801
+ cursor: not-allowed;
802
+ color: var(--color-input-text-field-disabled, var(--input-text-field-disabled));
803
+ }
804
+
805
+ .IncodeEmailPage .IncodeEmailInputField:focus {
806
+ --tw-outline-style: none;
807
+ outline-style: none;
808
+ }
809
+
810
+ .IncodeEmailPage .IncodeEmailInputError {
811
+ margin: var(--spacing-0, var(--spacing-none, 0px));
812
+ text-align: center;
813
+ font-size: var(--text-14, var(--primitive-typography-size-14));
814
+ --tw-font-weight: var(--font-weight-medium, var(--primitive-typography-weight-medium));
815
+ font-weight: var(--font-weight-medium, var(--primitive-typography-weight-medium));
816
+ color: var(--color-input-text-helper-negative, var(--input-text-helper-negative));
817
+ }
818
+
819
+ .IncodeFlowStart {
820
+ width: 100%;
821
+ height: 100%;
822
+ padding-inline: var(--spacing-24, var(--spacing-24, 24px));
823
+ padding-top: var(--spacing-20, var(--spacing-20, 20px));
824
+ padding-bottom: var(--spacing-32, var(--spacing-32, 32px));
825
+ flex-direction: column;
826
+ justify-content: center;
827
+ align-items: center;
828
+ display: flex;
829
+ }
830
+
831
+ .IncodeFlowStartContent {
832
+ text-align: center;
833
+ flex-direction: column;
834
+ justify-content: space-between;
835
+ align-items: center;
836
+ width: 100%;
837
+ height: 100%;
838
+ display: flex;
839
+ }
840
+
841
+ .IncodeFlowStartCenterSection {
842
+ flex-direction: column;
843
+ flex: 1;
844
+ justify-content: center;
845
+ align-items: center;
846
+ width: 100%;
847
+ display: flex;
848
+ }
849
+
850
+ .IncodeFlowStartLogoContainer {
851
+ justify-content: center;
852
+ align-items: center;
853
+ min-width: 100px;
854
+ max-height: 250px;
855
+ display: flex;
856
+ }
857
+
858
+ .IncodeFlowStartLogo {
859
+ object-fit: contain;
860
+ width: 260px;
861
+ max-width: 100%;
862
+ height: auto;
863
+ max-height: 100%;
864
+ }
865
+
866
+ @media screen and (max-width: 767px) {
867
+ .IncodeFlowStartLogo {
868
+ width: 200px;
869
+ }
870
+ }
871
+
872
+ .IncodeFlowStartSubtitle {
873
+ color: #20263d;
874
+ text-align: center;
875
+ margin-top: 10px;
876
+ font-size: 1.5rem;
877
+ font-weight: bold;
878
+ line-height: 1.37;
879
+ }
880
+
881
+ .IncodeFlowStartButton {
882
+ margin-top: auto;
883
+ }
884
+
885
+ @media screen and (min-width: 992px) {
886
+ .IncodeFlowStart {
887
+ padding: 5% 20% 15%;
888
+ }
889
+ }
890
+
891
+ .IncodeFlowCompleted {
892
+ width: 100%;
893
+ height: 100%;
894
+ padding: var(--spacing-20, var(--spacing-20, 20px));
895
+ flex-direction: column;
896
+ justify-content: center;
897
+ align-items: center;
898
+ display: flex;
899
+ }
900
+
901
+ .IncodeComponent .IncodeFlowCompleted h1.IncodeFlowCompletedTitle {
902
+ color: #20263d;
903
+ text-align: left;
904
+ width: 100%;
905
+ margin: 20px 0;
906
+ font-size: 2rem;
907
+ font-weight: 700;
908
+ }
909
+
910
+ .IncodeComponent .IncodeFlowCompleted p.IncodeFlowCompletedSubtitle {
911
+ color: #20263d;
912
+ text-align: left;
913
+ width: 100%;
914
+ margin: 20px 0;
915
+ font-size: 1rem;
916
+ font-weight: 700;
917
+ }
918
+
919
+ @media screen and (min-width: 992px) {
920
+ .IncodeComponent .IncodeFlowCompleted h1.IncodeFlowCompletedTitle, .IncodeComponent .IncodeFlowCompleted p.IncodeFlowCompletedSubtitle {
921
+ text-align: center;
922
+ }
923
+ }
924
+
925
+ .IncodeUnsupportedModule {
926
+ min-height: 100vh;
927
+ padding: var(--spacing-16, var(--spacing-16, 16px));
928
+ flex-direction: column;
929
+ justify-content: center;
930
+ align-items: center;
931
+ display: flex;
932
+ }
933
+
934
+ .IncodeUnsupportedModule .IncodeUnsupportedModuleContent, .IncodeUnsupportedModule .IncodeUnsupportedModuleContent .IncodeUnsupportedModuleContent {
935
+ max-width: var(--container-md, 28rem);
936
+ align-items: center;
937
+ gap: var(--spacing-16, var(--spacing-16, 16px));
938
+ text-align: center;
939
+ flex-direction: column;
940
+ display: flex;
941
+ }
942
+
943
+ .IncodeUnsupportedModule .IncodeUnsupportedModuleContent .IncodeUnsupportedModuleTitle {
944
+ font-family: var(--primitive-typography-family-dm-sans);
945
+ font-size: var(--typography-headline-h2-size);
946
+ font-weight: var(--typography-headline-h2-weight);
947
+ line-height: var(--typography-headline-h2-line-height);
948
+ letter-spacing: var(--typography-headline-h2-letter-spacing);
949
+ color: var(--color-text-body-primary, var(--text-body-primary));
950
+ }
951
+
952
+ .IncodeUnsupportedModule .IncodeUnsupportedModuleContent .IncodeUnsupportedModuleMessage {
953
+ font-family: var(--primitive-typography-family-dm-sans);
954
+ font-size: var(--typography-headline-h5-size);
955
+ font-weight: var(--typography-headline-h5-weight);
956
+ line-height: var(--typography-headline-h5-line-height);
957
+ letter-spacing: var(--typography-headline-h5-letter-spacing);
958
+ color: var(--color-text-body-secondary, var(--text-body-secondary));
959
+ }
960
+
961
+ .IncodeUnsupportedModule .IncodeUnsupportedModuleContent .IncodeUnsupportedModuleButton {
962
+ margin-top: var(--spacing-8, var(--spacing-8, 8px));
963
+ }
964
+
965
+ .IncodeIdTutorial {
966
+ --brand-color: var(--surface-brand-500);
967
+ }
968
+
969
+ .IncodeIdTutorial .IncodePageTitleContainer {
970
+ padding-block: var(--spacing-16, var(--spacing-16, 16px));
971
+ }
972
+
973
+ .IncodeIdTutorial .IncodeBaseTutorialContainer {
974
+ margin: calc(var(--spacing-24, var(--spacing-24, 24px)) * -1);
975
+ }
976
+
977
+ .IncodeIdTutorial .IncodeBaseTutorialAnimationContainer {
978
+ padding: var(--spacing-0, var(--spacing-none, 0px));
979
+ }
980
+
981
+ .IncodeIdTutorial.IncodeIdTutorialId .IncodeBaseTutorialAnimation svg > g > g > g:nth-child(2) > g:nth-child(5) > g > g > g:nth-child(3) > g > path, .IncodeIdTutorial.IncodeIdTutorialId .IncodeBaseTutorialAnimation svg > g > g > g:first-child > g > path, .IncodeIdTutorial.IncodeIdTutorialPassport .IncodeBaseTutorialAnimation svg > g > g:nth-child(2) > g:nth-child(2) > g:nth-child(2) > g:nth-child(2) > g > g > g > g:nth-child(4) > g > path, .IncodeIdTutorial.IncodeIdTutorialPassport .IncodeBaseTutorialAnimation svg > g > g:first-child > g > path {
982
+ fill: var(--brand-color);
983
+ }
984
+
985
+ .IncodeFlipAnimation {
986
+ background-color: var(--color-surface-neutral-0, var(--surface-neutral-0));
987
+ height: 100%;
988
+ padding: var(--spacing-24, var(--spacing-24, 24px));
989
+ flex-direction: column;
990
+ justify-content: center;
991
+ align-items: center;
992
+ display: flex;
993
+ }
994
+
995
+ .IncodeCommonIssuesModal {
996
+ inset: var(--spacing-0, var(--spacing-none, 0px));
997
+ z-index: 1000;
998
+ background-color: var(--color-surface-neutral-0, var(--surface-neutral-0));
999
+ flex-direction: column;
1000
+ display: flex;
1001
+ position: fixed;
1002
+ }
1003
+
1004
+ @media (min-width: 40rem) {
1005
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1006
+ max-width: 40rem;
1007
+ }
1008
+ }
1009
+
1010
+ @media (min-width: 48rem) {
1011
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1012
+ max-width: 48rem;
1013
+ }
1014
+ }
1015
+
1016
+ @media (min-width: 64rem) {
1017
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1018
+ max-width: 64rem;
1019
+ }
1020
+ }
1021
+
1022
+ @media (min-width: 80rem) {
1023
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1024
+ max-width: 80rem;
1025
+ }
1026
+ }
1027
+
1028
+ @media (min-width: 96rem) {
1029
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1030
+ max-width: 96rem;
1031
+ }
1032
+ }
1033
+
1034
+ @media (min-width: 48rem) {
1035
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1036
+ height: 840px;
1037
+ }
1038
+ }
1039
+
1040
+ @media (min-width: 40rem) {
1041
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1042
+ max-width: 40rem;
1043
+ }
1044
+ }
1045
+
1046
+ @media (min-width: 48rem) {
1047
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1048
+ max-width: 48rem;
1049
+ }
1050
+ }
1051
+
1052
+ @media (min-width: 64rem) {
1053
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1054
+ max-width: 64rem;
1055
+ }
1056
+ }
1057
+
1058
+ @media (min-width: 80rem) {
1059
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1060
+ max-width: 80rem;
1061
+ }
1062
+ }
1063
+
1064
+ @media (min-width: 96rem) {
1065
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1066
+ max-width: 96rem;
1067
+ }
1068
+ }
1069
+
1070
+ @media (min-width: 48rem) {
1071
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1072
+ height: 840px;
1073
+ }
1074
+ }
1075
+
1076
+ @media (min-width: 40rem) {
1077
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1078
+ max-width: 40rem;
1079
+ }
1080
+ }
1081
+
1082
+ @media (min-width: 48rem) {
1083
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1084
+ max-width: 48rem;
1085
+ }
1086
+ }
1087
+
1088
+ @media (min-width: 64rem) {
1089
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1090
+ max-width: 64rem;
1091
+ }
1092
+ }
1093
+
1094
+ @media (min-width: 80rem) {
1095
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1096
+ max-width: 80rem;
1097
+ }
1098
+ }
1099
+
1100
+ @media (min-width: 96rem) {
1101
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1102
+ max-width: 96rem;
1103
+ }
1104
+ }
1105
+
1106
+ @media (min-width: 48rem) {
1107
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1108
+ height: 840px;
1109
+ }
1110
+ }
1111
+
1112
+ @media (min-width: 40rem) {
1113
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1114
+ max-width: 40rem;
1115
+ }
1116
+ }
1117
+
1118
+ @media (min-width: 48rem) {
1119
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1120
+ max-width: 48rem;
1121
+ }
1122
+ }
1123
+
1124
+ @media (min-width: 64rem) {
1125
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1126
+ max-width: 64rem;
1127
+ }
1128
+ }
1129
+
1130
+ @media (min-width: 80rem) {
1131
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1132
+ max-width: 80rem;
1133
+ }
1134
+ }
1135
+
1136
+ @media (min-width: 96rem) {
1137
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1138
+ max-width: 96rem;
1139
+ }
1140
+ }
1141
+
1142
+ @media (min-width: 48rem) {
1143
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1144
+ height: 840px;
1145
+ }
1146
+ }
1147
+
1148
+ @media (min-width: 40rem) {
1149
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1150
+ max-width: 40rem;
1151
+ }
1152
+ }
1153
+
1154
+ @media (min-width: 48rem) {
1155
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1156
+ max-width: 48rem;
1157
+ }
1158
+ }
1159
+
1160
+ @media (min-width: 64rem) {
1161
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1162
+ max-width: 64rem;
1163
+ }
1164
+ }
1165
+
1166
+ @media (min-width: 80rem) {
1167
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1168
+ max-width: 80rem;
1169
+ }
1170
+ }
1171
+
1172
+ @media (min-width: 96rem) {
1173
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1174
+ max-width: 96rem;
1175
+ }
1176
+ }
1177
+
1178
+ @media (min-width: 48rem) {
1179
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1180
+ height: 840px;
1181
+ }
1182
+ }
1183
+
1184
+ @media (min-width: 40rem) {
1185
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1186
+ max-width: 40rem;
1187
+ }
1188
+ }
1189
+
1190
+ @media (min-width: 48rem) {
1191
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1192
+ max-width: 48rem;
1193
+ }
1194
+ }
1195
+
1196
+ @media (min-width: 64rem) {
1197
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1198
+ max-width: 64rem;
1199
+ }
1200
+ }
1201
+
1202
+ @media (min-width: 80rem) {
1203
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1204
+ max-width: 80rem;
1205
+ }
1206
+ }
1207
+
1208
+ @media (min-width: 96rem) {
1209
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1210
+ max-width: 96rem;
1211
+ }
1212
+ }
1213
+
1214
+ @media (min-width: 48rem) {
1215
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1216
+ height: 840px;
1217
+ }
1218
+ }
1219
+
1220
+ @media (min-width: 40rem) {
1221
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1222
+ max-width: 40rem;
1223
+ }
1224
+ }
1225
+
1226
+ @media (min-width: 48rem) {
1227
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1228
+ max-width: 48rem;
1229
+ }
1230
+ }
1231
+
1232
+ @media (min-width: 64rem) {
1233
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1234
+ max-width: 64rem;
1235
+ }
1236
+ }
1237
+
1238
+ @media (min-width: 80rem) {
1239
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1240
+ max-width: 80rem;
1241
+ }
1242
+ }
1243
+
1244
+ @media (min-width: 96rem) {
1245
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1246
+ max-width: 96rem;
1247
+ }
1248
+ }
1249
+
1250
+ @media (min-width: 48rem) {
1251
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1252
+ height: 840px;
1253
+ }
1254
+ }
1255
+
1256
+ @media (min-width: 40rem) {
1257
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1258
+ max-width: 40rem;
1259
+ }
1260
+ }
1261
+
1262
+ @media (min-width: 48rem) {
1263
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1264
+ max-width: 48rem;
1265
+ }
1266
+ }
1267
+
1268
+ @media (min-width: 64rem) {
1269
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1270
+ max-width: 64rem;
1271
+ }
1272
+ }
1273
+
1274
+ @media (min-width: 80rem) {
1275
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1276
+ max-width: 80rem;
1277
+ }
1278
+ }
1279
+
1280
+ @media (min-width: 96rem) {
1281
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1282
+ max-width: 96rem;
1283
+ }
1284
+ }
1285
+
1286
+ @media (min-width: 48rem) {
1287
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1288
+ height: 840px;
1289
+ }
1290
+ }
1291
+
1292
+ @media (min-width: 40rem) {
1293
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1294
+ max-width: 40rem;
1295
+ }
1296
+ }
1297
+
1298
+ @media (min-width: 48rem) {
1299
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1300
+ max-width: 48rem;
1301
+ }
1302
+ }
1303
+
1304
+ @media (min-width: 64rem) {
1305
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1306
+ max-width: 64rem;
1307
+ }
1308
+ }
1309
+
1310
+ @media (min-width: 80rem) {
1311
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1312
+ max-width: 80rem;
1313
+ }
1314
+ }
1315
+
1316
+ @media (min-width: 96rem) {
1317
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1318
+ max-width: 96rem;
1319
+ }
1320
+ }
1321
+
1322
+ @media (min-width: 48rem) {
1323
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1324
+ height: 840px;
1325
+ }
1326
+ }
1327
+
1328
+ @media (min-width: 40rem) {
1329
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1330
+ max-width: 40rem;
1331
+ }
1332
+ }
1333
+
1334
+ @media (min-width: 48rem) {
1335
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1336
+ max-width: 48rem;
1337
+ }
1338
+ }
1339
+
1340
+ @media (min-width: 64rem) {
1341
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1342
+ max-width: 64rem;
1343
+ }
1344
+ }
1345
+
1346
+ @media (min-width: 80rem) {
1347
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1348
+ max-width: 80rem;
1349
+ }
1350
+ }
1351
+
1352
+ @media (min-width: 96rem) {
1353
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1354
+ max-width: 96rem;
1355
+ }
1356
+ }
1357
+
1358
+ @media (min-width: 48rem) {
1359
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1360
+ height: 840px;
1361
+ }
1362
+ }
1363
+
1364
+ @media (min-width: 40rem) {
1365
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1366
+ max-width: 40rem;
1367
+ }
1368
+ }
1369
+
1370
+ @media (min-width: 48rem) {
1371
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1372
+ max-width: 48rem;
1373
+ }
1374
+ }
1375
+
1376
+ @media (min-width: 64rem) {
1377
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1378
+ max-width: 64rem;
1379
+ }
1380
+ }
1381
+
1382
+ @media (min-width: 80rem) {
1383
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1384
+ max-width: 80rem;
1385
+ }
1386
+ }
1387
+
1388
+ @media (min-width: 96rem) {
1389
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1390
+ max-width: 96rem;
1391
+ }
1392
+ }
1393
+
1394
+ @media (min-width: 48rem) {
1395
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1396
+ height: 840px;
1397
+ }
1398
+ }
1399
+
1400
+ @media (min-width: 40rem) {
1401
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1402
+ max-width: 40rem;
1403
+ }
1404
+ }
1405
+
1406
+ @media (min-width: 48rem) {
1407
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1408
+ max-width: 48rem;
1409
+ }
1410
+ }
1411
+
1412
+ @media (min-width: 64rem) {
1413
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1414
+ max-width: 64rem;
1415
+ }
1416
+ }
1417
+
1418
+ @media (min-width: 80rem) {
1419
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1420
+ max-width: 80rem;
1421
+ }
1422
+ }
1423
+
1424
+ @media (min-width: 96rem) {
1425
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1426
+ max-width: 96rem;
1427
+ }
1428
+ }
1429
+
1430
+ @media (min-width: 48rem) {
1431
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1432
+ height: 840px;
1433
+ }
1434
+ }
1435
+
1436
+ @media (min-width: 40rem) {
1437
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1438
+ max-width: 40rem;
1439
+ }
1440
+ }
1441
+
1442
+ @media (min-width: 48rem) {
1443
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1444
+ max-width: 48rem;
1445
+ }
1446
+ }
1447
+
1448
+ @media (min-width: 64rem) {
1449
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1450
+ max-width: 64rem;
1451
+ }
1452
+ }
1453
+
1454
+ @media (min-width: 80rem) {
1455
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1456
+ max-width: 80rem;
1457
+ }
1458
+ }
1459
+
1460
+ @media (min-width: 96rem) {
1461
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1462
+ max-width: 96rem;
1463
+ }
1464
+ }
1465
+
1466
+ @media (min-width: 48rem) {
1467
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1468
+ height: 840px;
1469
+ }
1470
+ }
1471
+
1472
+ @media (min-width: 40rem) {
1473
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1474
+ max-width: 40rem;
1475
+ }
1476
+ }
1477
+
1478
+ @media (min-width: 48rem) {
1479
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1480
+ max-width: 48rem;
1481
+ }
1482
+ }
1483
+
1484
+ @media (min-width: 64rem) {
1485
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1486
+ max-width: 64rem;
1487
+ }
1488
+ }
1489
+
1490
+ @media (min-width: 80rem) {
1491
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1492
+ max-width: 80rem;
1493
+ }
1494
+ }
1495
+
1496
+ @media (min-width: 96rem) {
1497
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1498
+ max-width: 96rem;
1499
+ }
1500
+ }
1501
+
1502
+ @media (min-width: 48rem) {
1503
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1504
+ height: 840px;
1505
+ }
1506
+ }
1507
+
1508
+ @media (min-width: 40rem) {
1509
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1510
+ max-width: 40rem;
1511
+ }
1512
+ }
1513
+
1514
+ @media (min-width: 48rem) {
1515
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1516
+ max-width: 48rem;
1517
+ }
1518
+ }
1519
+
1520
+ @media (min-width: 64rem) {
1521
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1522
+ max-width: 64rem;
1523
+ }
1524
+ }
1525
+
1526
+ @media (min-width: 80rem) {
1527
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1528
+ max-width: 80rem;
1529
+ }
1530
+ }
1531
+
1532
+ @media (min-width: 96rem) {
1533
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1534
+ max-width: 96rem;
1535
+ }
1536
+ }
1537
+
1538
+ @media (min-width: 48rem) {
1539
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1540
+ height: 840px;
1541
+ }
1542
+ }
1543
+
1544
+ @media (min-width: 40rem) {
1545
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1546
+ max-width: 40rem;
1547
+ }
1548
+ }
1549
+
1550
+ @media (min-width: 48rem) {
1551
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1552
+ max-width: 48rem;
1553
+ }
1554
+ }
1555
+
1556
+ @media (min-width: 64rem) {
1557
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1558
+ max-width: 64rem;
1559
+ }
1560
+ }
1561
+
1562
+ @media (min-width: 80rem) {
1563
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1564
+ max-width: 80rem;
1565
+ }
1566
+ }
1567
+
1568
+ @media (min-width: 96rem) {
1569
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1570
+ max-width: 96rem;
1571
+ }
1572
+ }
1573
+
1574
+ @media (min-width: 48rem) {
1575
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1576
+ height: 840px;
1577
+ }
1578
+ }
1579
+
1580
+ @media (min-width: 40rem) {
1581
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1582
+ max-width: 40rem;
1583
+ }
1584
+ }
1585
+
1586
+ @media (min-width: 48rem) {
1587
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1588
+ max-width: 48rem;
1589
+ }
1590
+ }
1591
+
1592
+ @media (min-width: 64rem) {
1593
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1594
+ max-width: 64rem;
1595
+ }
1596
+ }
1597
+
1598
+ @media (min-width: 80rem) {
1599
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1600
+ max-width: 80rem;
1601
+ }
1602
+ }
1603
+
1604
+ @media (min-width: 96rem) {
1605
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1606
+ max-width: 96rem;
1607
+ }
1608
+ }
1609
+
1610
+ @media (min-width: 48rem) {
1611
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1612
+ height: 840px;
1613
+ }
1614
+ }
1615
+
1616
+ @media (min-width: 40rem) {
1617
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1618
+ max-width: 40rem;
1619
+ }
1620
+ }
1621
+
1622
+ @media (min-width: 48rem) {
1623
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1624
+ max-width: 48rem;
1625
+ }
1626
+ }
1627
+
1628
+ @media (min-width: 64rem) {
1629
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1630
+ max-width: 64rem;
1631
+ }
1632
+ }
1633
+
1634
+ @media (min-width: 80rem) {
1635
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1636
+ max-width: 80rem;
1637
+ }
1638
+ }
1639
+
1640
+ @media (min-width: 96rem) {
1641
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1642
+ max-width: 96rem;
1643
+ }
1644
+ }
1645
+
1646
+ @media (min-width: 48rem) {
1647
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1648
+ height: 840px;
1649
+ }
1650
+ }
1651
+
1652
+ @media (min-width: 40rem) {
1653
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1654
+ max-width: 40rem;
1655
+ }
1656
+ }
1657
+
1658
+ @media (min-width: 48rem) {
1659
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1660
+ max-width: 48rem;
1661
+ }
1662
+ }
1663
+
1664
+ @media (min-width: 64rem) {
1665
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1666
+ max-width: 64rem;
1667
+ }
1668
+ }
1669
+
1670
+ @media (min-width: 80rem) {
1671
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1672
+ max-width: 80rem;
1673
+ }
1674
+ }
1675
+
1676
+ @media (min-width: 96rem) {
1677
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1678
+ max-width: 96rem;
1679
+ }
1680
+ }
1681
+
1682
+ @media (min-width: 48rem) {
1683
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1684
+ height: 840px;
1685
+ }
1686
+ }
1687
+
1688
+ @media (min-width: 40rem) {
1689
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1690
+ max-width: 40rem;
1691
+ }
1692
+ }
1693
+
1694
+ @media (min-width: 48rem) {
1695
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1696
+ max-width: 48rem;
1697
+ }
1698
+ }
1699
+
1700
+ @media (min-width: 64rem) {
1701
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1702
+ max-width: 64rem;
1703
+ }
1704
+ }
1705
+
1706
+ @media (min-width: 80rem) {
1707
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1708
+ max-width: 80rem;
1709
+ }
1710
+ }
1711
+
1712
+ @media (min-width: 96rem) {
1713
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1714
+ max-width: 96rem;
1715
+ }
1716
+ }
1717
+
1718
+ @media (min-width: 48rem) {
1719
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1720
+ height: 840px;
1721
+ }
1722
+ }
1723
+
1724
+ @media (min-width: 40rem) {
1725
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1726
+ max-width: 40rem;
1727
+ }
1728
+ }
1729
+
1730
+ @media (min-width: 48rem) {
1731
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1732
+ max-width: 48rem;
1733
+ }
1734
+ }
1735
+
1736
+ @media (min-width: 64rem) {
1737
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1738
+ max-width: 64rem;
1739
+ }
1740
+ }
1741
+
1742
+ @media (min-width: 80rem) {
1743
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1744
+ max-width: 80rem;
1745
+ }
1746
+ }
1747
+
1748
+ @media (min-width: 96rem) {
1749
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1750
+ max-width: 96rem;
1751
+ }
1752
+ }
1753
+
1754
+ @media (min-width: 48rem) {
1755
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1756
+ height: 840px;
1757
+ }
1758
+ }
1759
+
1760
+ @media (min-width: 40rem) {
1761
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1762
+ max-width: 40rem;
1763
+ }
1764
+ }
1765
+
1766
+ @media (min-width: 48rem) {
1767
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1768
+ max-width: 48rem;
1769
+ }
1770
+ }
1771
+
1772
+ @media (min-width: 64rem) {
1773
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1774
+ max-width: 64rem;
1775
+ }
1776
+ }
1777
+
1778
+ @media (min-width: 80rem) {
1779
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1780
+ max-width: 80rem;
1781
+ }
1782
+ }
1783
+
1784
+ @media (min-width: 96rem) {
1785
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1786
+ max-width: 96rem;
1787
+ }
1788
+ }
1789
+
1790
+ @media (min-width: 48rem) {
1791
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1792
+ height: 840px;
1793
+ }
1794
+ }
1795
+
1796
+ @media (min-width: 40rem) {
1797
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1798
+ max-width: 40rem;
1799
+ }
1800
+ }
1801
+
1802
+ @media (min-width: 48rem) {
1803
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1804
+ max-width: 48rem;
1805
+ }
1806
+ }
1807
+
1808
+ @media (min-width: 64rem) {
1809
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1810
+ max-width: 64rem;
1811
+ }
1812
+ }
1813
+
1814
+ @media (min-width: 80rem) {
1815
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1816
+ max-width: 80rem;
1817
+ }
1818
+ }
1819
+
1820
+ @media (min-width: 96rem) {
1821
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1822
+ max-width: 96rem;
1823
+ }
1824
+ }
1825
+
1826
+ @media (min-width: 48rem) {
1827
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1828
+ height: 840px;
1829
+ }
1830
+ }
1831
+
1832
+ @media (min-width: 40rem) {
1833
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1834
+ max-width: 40rem;
1835
+ }
1836
+ }
1837
+
1838
+ @media (min-width: 48rem) {
1839
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1840
+ max-width: 48rem;
1841
+ }
1842
+ }
1843
+
1844
+ @media (min-width: 64rem) {
1845
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1846
+ max-width: 64rem;
1847
+ }
1848
+ }
1849
+
1850
+ @media (min-width: 80rem) {
1851
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1852
+ max-width: 80rem;
1853
+ }
1854
+ }
1855
+
1856
+ @media (min-width: 96rem) {
1857
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1858
+ max-width: 96rem;
1859
+ }
1860
+ }
1861
+
1862
+ @media (min-width: 48rem) {
1863
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1864
+ height: 840px;
1865
+ }
1866
+ }
1867
+
1868
+ @media (min-width: 40rem) {
1869
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1870
+ max-width: 40rem;
1871
+ }
1872
+ }
1873
+
1874
+ @media (min-width: 48rem) {
1875
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1876
+ max-width: 48rem;
1877
+ }
1878
+ }
1879
+
1880
+ @media (min-width: 64rem) {
1881
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1882
+ max-width: 64rem;
1883
+ }
1884
+ }
1885
+
1886
+ @media (min-width: 80rem) {
1887
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1888
+ max-width: 80rem;
1889
+ }
1890
+ }
1891
+
1892
+ @media (min-width: 96rem) {
1893
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1894
+ max-width: 96rem;
1895
+ }
1896
+ }
1897
+
1898
+ @media (min-width: 48rem) {
1899
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1900
+ height: 840px;
1901
+ }
1902
+ }
1903
+
1904
+ @media (min-width: 40rem) {
1905
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1906
+ max-width: 40rem;
1907
+ }
1908
+ }
1909
+
1910
+ @media (min-width: 48rem) {
1911
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1912
+ max-width: 48rem;
1913
+ }
1914
+ }
1915
+
1916
+ @media (min-width: 64rem) {
1917
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1918
+ max-width: 64rem;
1919
+ }
1920
+ }
1921
+
1922
+ @media (min-width: 80rem) {
1923
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1924
+ max-width: 80rem;
1925
+ }
1926
+ }
1927
+
1928
+ @media (min-width: 96rem) {
1929
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1930
+ max-width: 96rem;
1931
+ }
1932
+ }
1933
+
1934
+ @media (min-width: 48rem) {
1935
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1936
+ height: 840px;
1937
+ }
1938
+ }
1939
+
1940
+ @media (min-width: 40rem) {
1941
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1942
+ max-width: 40rem;
1943
+ }
1944
+ }
1945
+
1946
+ @media (min-width: 48rem) {
1947
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1948
+ max-width: 48rem;
1949
+ }
1950
+ }
1951
+
1952
+ @media (min-width: 64rem) {
1953
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1954
+ max-width: 64rem;
1955
+ }
1956
+ }
1957
+
1958
+ @media (min-width: 80rem) {
1959
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1960
+ max-width: 80rem;
1961
+ }
1962
+ }
1963
+
1964
+ @media (min-width: 96rem) {
1965
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1966
+ max-width: 96rem;
1967
+ }
1968
+ }
1969
+
1970
+ @media (min-width: 48rem) {
1971
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1972
+ height: 840px;
1973
+ }
1974
+ }
1975
+
1976
+ @media (min-width: 40rem) {
1977
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1978
+ max-width: 40rem;
1979
+ }
1980
+ }
1981
+
1982
+ @media (min-width: 48rem) {
1983
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1984
+ max-width: 48rem;
1985
+ }
1986
+ }
1987
+
1988
+ @media (min-width: 64rem) {
1989
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1990
+ max-width: 64rem;
1991
+ }
1992
+ }
1993
+
1994
+ @media (min-width: 80rem) {
1995
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
1996
+ max-width: 80rem;
1997
+ }
1998
+ }
1999
+
2000
+ @media (min-width: 96rem) {
2001
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
2002
+ max-width: 96rem;
2003
+ }
2004
+ }
2005
+
2006
+ @media (min-width: 48rem) {
2007
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
2008
+ height: 840px;
2009
+ }
2010
+ }
2011
+
2012
+ @media (min-width: 40rem) {
2013
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
2014
+ max-width: 40rem;
2015
+ }
2016
+ }
2017
+
2018
+ @media (min-width: 48rem) {
2019
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
2020
+ max-width: 48rem;
2021
+ }
2022
+ }
2023
+
2024
+ @media (min-width: 64rem) {
2025
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
2026
+ max-width: 64rem;
2027
+ }
2028
+ }
2029
+
2030
+ @media (min-width: 80rem) {
2031
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
2032
+ max-width: 80rem;
2033
+ }
2034
+ }
2035
+
2036
+ @media (min-width: 96rem) {
2037
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
2038
+ max-width: 96rem;
2039
+ }
2040
+ }
2041
+
2042
+ @media (min-width: 48rem) {
2043
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
2044
+ height: 840px;
2045
+ }
2046
+ }
2047
+
2048
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
2049
+ width: 100%;
2050
+ }
2051
+
2052
+ @media (min-width: 40rem) {
2053
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
2054
+ max-width: 40rem;
2055
+ }
2056
+ }
2057
+
2058
+ @media (min-width: 48rem) {
2059
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
2060
+ max-width: 48rem;
2061
+ }
2062
+ }
2063
+
2064
+ @media (min-width: 64rem) {
2065
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
2066
+ max-width: 64rem;
2067
+ }
2068
+ }
2069
+
2070
+ @media (min-width: 80rem) {
2071
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
2072
+ max-width: 80rem;
2073
+ }
2074
+ }
2075
+
2076
+ @media (min-width: 96rem) {
2077
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
2078
+ max-width: 96rem;
2079
+ }
2080
+ }
2081
+
2082
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
2083
+ height: 100%;
2084
+ margin: auto;
2085
+ }
2086
+
2087
+ @media (min-width: 48rem) {
2088
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
2089
+ height: 840px;
2090
+ }
2091
+ }
2092
+
2093
+ .IncodeCommonIssuesModal .IncodeCommonIssuesModalContent {
2094
+ padding: var(--spacing-24, var(--spacing-24, 24px));
2095
+ flex-direction: column;
2096
+ margin-inline: auto;
2097
+ display: flex;
2098
+ }
2099
+
2100
+ .IncodeCommonIssuesModal .IncodeCommonIssuesHeader {
2101
+ height: 44px;
2102
+ padding-inline: var(--spacing-20, var(--spacing-20, 20px));
2103
+ padding-block: var(--spacing-8, var(--spacing-8, 8px));
2104
+ flex-shrink: 0;
2105
+ justify-content: flex-end;
2106
+ align-items: center;
2107
+ display: flex;
2108
+ }
2109
+
2110
+ .IncodeCommonIssuesModal .IncodeCommonIssuesCloseButton {
2111
+ padding: var(--spacing-0, var(--spacing-none, 0px));
2112
+ cursor: pointer;
2113
+ border-style: var(--tw-border-style);
2114
+ border-width: var(--border-width-none, var(--border-none));
2115
+ --tw-border-style: none;
2116
+ color: var(--color-text-body-primary, var(--text-body-primary));
2117
+ background-color: #0000;
2118
+ border-style: none;
2119
+ justify-content: center;
2120
+ align-items: center;
2121
+ display: flex;
2122
+ }
2123
+
2124
+ .IncodeCommonIssuesModal .IncodeCommonIssuesContent {
2125
+ padding: var(--spacing-24, var(--spacing-24, 24px));
2126
+ flex-direction: column;
2127
+ flex: 1;
2128
+ align-items: center;
2129
+ margin-inline: auto;
2130
+ display: flex;
2131
+ }
2132
+
2133
+ .IncodeCommonIssuesModal .IncodeCommonIssuesContent .IncodeCommonIssuesQuestionIcon {
2134
+ flex-shrink: 0;
2135
+ }
2136
+
2137
+ .IncodeCommonIssuesModal .IncodeCommonIssuesContent .IncodeCommonIssuesTitle {
2138
+ font-family: var(--primitive-typography-family-dm-sans);
2139
+ font-size: var(--typography-headline-h2-size);
2140
+ font-weight: var(--typography-headline-h2-weight);
2141
+ line-height: var(--typography-headline-h2-line-height);
2142
+ letter-spacing: var(--typography-headline-h2-letter-spacing);
2143
+ }
2144
+
2145
+ .IncodeCommonIssuesModal .IncodeCommonIssuesContent .IncodeCommonIssuesCards {
2146
+ gap: var(--spacing-32, var(--spacing-32, 32px));
2147
+ width: 100%;
2148
+ padding-block: var(--spacing-16, var(--spacing-16, 16px));
2149
+ flex-direction: column;
2150
+ display: flex;
2151
+ }
2152
+
2153
+ .IncodeCommonIssuesModal .IncodeCommonIssuesContent .IncodeCommonIssuesCard {
2154
+ align-items: flex-start;
2155
+ gap: var(--spacing-16, var(--spacing-16, 16px));
2156
+ background-color: var(--surface-neutral-50);
2157
+ border-radius: 12px;
2158
+ display: flex;
2159
+ }
2160
+
2161
+ .IncodeCommonIssuesModal .IncodeCommonIssuesContent .IncodeCommonIssuesCardIcon {
2162
+ color: var(--color-text-body-primary, var(--text-body-primary));
2163
+ flex-shrink: 0;
2164
+ }
2165
+
2166
+ .IncodeCommonIssuesModal .IncodeCommonIssuesContent .IncodeCommonIssuesCardText {
2167
+ gap: var(--spacing-4, var(--spacing-4, 4px));
2168
+ flex-direction: column;
2169
+ display: flex;
2170
+ }
2171
+
2172
+ .IncodeCommonIssuesModal .IncodeCommonIssuesContent .IncodeCommonIssuesCardTitle {
2173
+ font-family: var(--primitive-typography-family-dm-sans);
2174
+ font-size: var(--typography-headline-h5-size);
2175
+ font-weight: var(--typography-headline-h5-weight);
2176
+ line-height: var(--typography-headline-h5-line-height);
2177
+ letter-spacing: var(--typography-headline-h5-letter-spacing);
2178
+ }
2179
+
2180
+ .IncodeCommonIssuesModal .IncodeCommonIssuesContent .IncodeCommonIssuesCardBody {
2181
+ font-family: var(--primitive-typography-family-dm-sans);
2182
+ font-size: var(--typography-body-regular-size);
2183
+ font-weight: var(--typography-body-regular-weight);
2184
+ line-height: var(--typography-body-regular-line-height);
2185
+ letter-spacing: var(--typography-body-regular-letter-spacing);
2186
+ color: var(--color-text-body-secondary, var(--text-body-secondary));
2187
+ }
2188
+
2189
+ .IncodeCommonIssuesModal .IncodeCommonIssuesContent .IncodeCommonIssuesButtons {
2190
+ gap: var(--spacing-12, var(--spacing-12, 12px));
2191
+ flex-direction: column;
2192
+ width: 100%;
2193
+ margin-top: auto;
2194
+ display: flex;
2195
+ }
2196
+
2197
+ .IncodeCommonIssuesModal .IncodeCommonIssuesContent .IncodeCommonIssuesTakeManually {
2198
+ color: var(--color-text-body-primary, var(--text-body-primary));
2199
+ }
2200
+
2201
+ .IncodeCommonIssuesModal .IncodeCommonIssuesContent .IncodeCommonIssuesTryAgain {
2202
+ width: 100%;
2203
+ }
2204
+
2205
+ .IncodeChooserPage .IncodePageTitle {
2206
+ max-width: 250px;
2207
+ }
2208
+
2209
+ .IncodeChooserPage .IncodeChooserContainer {
2210
+ width: 100%;
2211
+ padding-bottom: var(--spacing-32, var(--spacing-32, 32px));
2212
+ flex-direction: column;
2213
+ align-items: center;
2214
+ margin-top: auto;
2215
+ display: flex;
2216
+ }
2217
+
2218
+ .IncodeChooserPage .IncodeChooserContainer .IncodeChooserButtons {
2219
+ gap: var(--spacing-24, var(--spacing-24, 24px));
2220
+ flex-direction: column;
2221
+ width: 100%;
2222
+ max-width: 420px;
2223
+ display: flex;
2224
+ }
2225
+
2226
+ .IncodeChooserPage .IncodeChooserContainer .IncodeChooserButton {
2227
+ min-height: var(--spacing-120, var(--spacing-120, 120px));
2228
+ cursor: pointer;
2229
+ touch-action: manipulation;
2230
+ border-radius: var(--radius-large, var(--border-radius-large));
2231
+ border-style: var(--tw-border-style);
2232
+ --tw-border-style: solid;
2233
+ border-style: solid;
2234
+ border-width: 1px;
2235
+ border-color: var(--color-border-neutral-100, var(--border-neutral-100));
2236
+ background-color: var(--color-surface-neutral-50, var(--surface-neutral-50));
2237
+ padding-top: var(--spacing-20, var(--spacing-20, 20px));
2238
+ padding-right: var(--spacing-24, var(--spacing-24, 24px));
2239
+ padding-bottom: var(--spacing-20, var(--spacing-20, 20px));
2240
+ padding-left: var(--spacing-20, var(--spacing-20, 20px));
2241
+ text-align: right;
2242
+ transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
2243
+ transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));
2244
+ transition-duration: var(--tw-duration, var(--default-transition-duration, .15s));
2245
+ --tw-duration: .2s;
2246
+ align-items: flex-start;
2247
+ transition-duration: .2s;
2248
+ display: flex;
2249
+ box-shadow: 0 2px 7px #0000000d, 0 2px 35px #21273b0d;
2250
+ }
2251
+
2252
+ .IncodeChooserPage .IncodeChooserContainer .IncodeChooserButton:active .IncodeChooserArrowRect {
2253
+ filter: brightness(.8);
2254
+ }
2255
+
2256
+ .IncodeChooserPage .IncodeChooserContainer .IncodeChooserButton:focus-visible {
2257
+ outline-width: 1px;
2258
+ outline-style: var(--tw-outline-style);
2259
+ outline-offset: 2px;
2260
+ outline-width: 2px;
2261
+ outline-color: var(--focus-ring-color);
2262
+ }
2263
+
2264
+ .IncodeChooserPage .IncodeChooserContainer .IncodeChooserButton:disabled {
2265
+ cursor: not-allowed;
2266
+ opacity: .6;
2267
+ }
2268
+
2269
+ .IncodeChooserPage .IncodeChooserContainer .IncodeChooserButton .IncodeChooserButtonIcon {
2270
+ flex-shrink: 0;
2271
+ justify-content: center;
2272
+ align-items: center;
2273
+ width: 120px;
2274
+ display: flex;
2275
+ }
2276
+
2277
+ .IncodeChooserPage .IncodeChooserContainer .IncodeChooserButton .IncodeChooserButtonIcon svg {
2278
+ width: 100%;
2279
+ height: auto;
2280
+ }
2281
+
2282
+ .IncodeChooserPage .IncodeChooserContainer .IncodeChooserButton .IncodeChooserButtonIcon .IncodePassportIcon .IncodePassportIconFill {
2283
+ fill: var(--color-surface-brand-500, var(--surface-brand-500-static));
2284
+ }
2285
+
2286
+ .IncodeChooserPage .IncodeChooserContainer .IncodeChooserButton .IncodeChooserButtonContent {
2287
+ flex-direction: column;
2288
+ flex: 1;
2289
+ align-self: stretch;
2290
+ align-items: flex-end;
2291
+ display: flex;
2292
+ }
2293
+
2294
+ .IncodeChooserPage .IncodeChooserContainer .IncodeChooserButton .IncodeChooserButtonContent .IncodeChooserButtonTitle {
2295
+ font-family: var(--primitive-typography-family-dm-sans);
2296
+ font-size: var(--typography-headline-h5-size);
2297
+ font-weight: var(--typography-headline-h5-weight);
2298
+ line-height: var(--typography-headline-h5-line-height);
2299
+ letter-spacing: var(--typography-headline-h5-letter-spacing);
2300
+ color: var(--color-text-body-primary, var(--text-body-primary));
2301
+ }
2302
+
2303
+ .IncodeChooserPage .IncodeChooserContainer .IncodeChooserButton .IncodeChooserButtonContent .IncodeChooserButtonDescription {
2304
+ font-family: var(--primitive-typography-family-dm-sans);
2305
+ font-size: var(--typography-body-regular-size);
2306
+ font-weight: var(--typography-body-regular-weight);
2307
+ line-height: var(--typography-body-regular-line-height);
2308
+ letter-spacing: var(--typography-body-regular-letter-spacing);
2309
+ color: var(--color-text-body-secondary, var(--text-body-secondary));
2310
+ max-width: 150px;
2311
+ }
2312
+
2313
+ .IncodeChooserPage .IncodeChooserContainer .IncodeChooserButton .IncodeChooserButtonContent .IncodeChooserButtonArrow {
2314
+ flex-shrink: 0;
2315
+ justify-content: center;
2316
+ align-self: flex-end;
2317
+ align-items: center;
2318
+ margin-top: auto;
2319
+ display: flex;
2320
+ }
2321
+
2322
+ .IncodeCaptureFrame {
2323
+ border-radius: var(--radius-medium, var(--border-radius-medium));
2324
+ --frame-border-color: var(--border-neutral-0);
2325
+ border: 4px solid var(--frame-border-color);
2326
+ justify-content: center;
2327
+ align-self: center;
2328
+ align-items: center;
2329
+ transition: max-width .3s ease-out, border-color .3s ease-out;
2330
+ display: flex;
2331
+ position: relative;
2332
+ }
2333
+
2334
+ .IncodeCaptureFrame.IncodeCaptureFrameHorizontal {
2335
+ aspect-ratio: 35 / 22;
2336
+ width: 100%;
2337
+ max-width: 640px;
2338
+ }
2339
+
2340
+ .IncodeCaptureFrame.IncodeCaptureFrameVertical {
2341
+ aspect-ratio: 22 / 35;
2342
+ width: 100%;
2343
+ max-width: 274px;
2344
+ }
2345
+
2346
+ .IncodeCaptureFrame.IncodeCaptureFramePassport {
2347
+ aspect-ratio: 42 / 30;
2348
+ }
2349
+
2350
+ .IncodeCaptureFrame.IncodeCaptureFrameIdle {
2351
+ --frame-border-color: var(--border-neutral-0);
2352
+ }
2353
+
2354
+ .IncodeCaptureFrame.IncodeCaptureFrameCapturing, .IncodeCaptureFrame.IncodeCaptureFrameFocus {
2355
+ --frame-border-color: var(--border-status-focus);
2356
+ }
2357
+
2358
+ .IncodeCaptureFrame.IncodeCaptureFrameAnalyzing, .IncodeCaptureFrame.IncodeCaptureFrameSuccess {
2359
+ --frame-border-color: var(--border-status-positive);
2360
+ }
2361
+
2362
+ .IncodeCaptureFrame.IncodeCaptureFrameError {
2363
+ --frame-border-color: var(--border-status-negative);
2364
+ }
2365
+
2366
+ .IncodeIdCapturePage {
2367
+ background-color: var(--color-surface-neutral-900, var(--surface-neutral-900));
2368
+ }
2369
+
2370
+ .IncodeIdCapturePage .IncodePageInner {
2371
+ padding: var(--spacing-0, var(--spacing-none, 0px));
2372
+ }
2373
+
2374
+ .IncodeIdCapturePage .IncodePageContent {
2375
+ flex: 1;
2376
+ position: relative;
2377
+ }
2378
+
2379
+ .IncodeIdCapturePage .IncodeCapture {
2380
+ width: 100%;
2381
+ height: 100%;
2382
+ position: relative;
2383
+ }
2384
+
2385
+ .IncodeIdCapturePage .IncodeCapture .IncodeCaptureVideo {
2386
+ pointer-events: none;
2387
+ inset: var(--spacing-0, var(--spacing-none, 0px));
2388
+ position: absolute;
2389
+ }
2390
+
2391
+ .IncodeIdCapturePage .IncodeCapture .IncodeCaptureVideo .IncodeCaptureVideoElement {
2392
+ inset: var(--spacing-0, var(--spacing-none, 0px));
2393
+ object-fit: cover;
2394
+ width: 100%;
2395
+ max-width: 100%;
2396
+ height: 100%;
2397
+ position: absolute;
2398
+ }
2399
+
2400
+ .IncodeIdCapturePage .IncodeCapture .IncodeCaptureOverlay {
2401
+ pointer-events: none;
2402
+ justify-content: center;
2403
+ align-items: center;
2404
+ display: flex;
2405
+ }
2406
+
2407
+ .IncodeIdCapturePage .IncodeCapture .IncodeCaptureButton {
2408
+ border-radius: var(--radius-button-primary, var(--button-primary-border-radius));
2409
+ padding-inline: var(--spacing-24, var(--spacing-24, 24px));
2410
+ padding-block: var(--spacing-12, var(--spacing-12, 12px));
2411
+ background-color: var(--color-button-primary-surface-default, var(--button-primary-surface-default));
2412
+ color: var(--color-button-primary-text-default, var(--button-primary-text-default));
2413
+ }
2414
+
2415
+ .IncodeIdCapturePage .IncodeCapture .IncodeCaptureInitializing {
2416
+ height: 100%;
2417
+ color: var(--color-text-body-0, var(--text-body-0-static));
2418
+ flex-direction: column;
2419
+ justify-content: center;
2420
+ align-items: center;
2421
+ display: flex;
2422
+ }
2423
+
2424
+ .IncodeIdCapturePage .IncodeCapture .IncodeCaptureInitializing .IncodeCaptureInitializingText {
2425
+ margin-top: var(--spacing-16, var(--spacing-16, 16px));
2426
+ }
2427
+
2428
+ .IncodeIdCapturePage .IncodeCapture .IncodeCaptureUploading {
2429
+ height: 100%;
2430
+ color: var(--color-text-body-0, var(--text-body-0-static));
2431
+ flex-direction: column;
2432
+ justify-content: center;
2433
+ align-items: center;
2434
+ display: flex;
2435
+ }
2436
+
2437
+ .IncodeIdCapturePage .IncodeComponent .IncodeCaptureVideoElement {
2438
+ inset: var(--spacing-0, var(--spacing-none, 0px));
2439
+ object-fit: cover;
2440
+ width: 100%;
2441
+ max-width: 100%;
2442
+ height: 100%;
2443
+ position: absolute;
2444
+ }
2445
+
2446
+ .IncodeCaptureOverlay {
2447
+ width: 100%;
2448
+ height: 100%;
2449
+ padding: var(--spacing-24, var(--spacing-24, 24px));
2450
+ flex-direction: column;
2451
+ display: flex;
2452
+ position: relative;
2453
+ }
2454
+
2455
+ .IncodeCaptureOverlay .IncodeCaptureTopSection {
2456
+ justify-content: flex-end;
2457
+ align-items: center;
2458
+ gap: var(--spacing-24, var(--spacing-24, 24px));
2459
+ padding-bottom: var(--spacing-40, var(--spacing-40, 40px));
2460
+ z-index: 10;
2461
+ flex-direction: column;
2462
+ flex: 1;
2463
+ display: flex;
2464
+ }
2465
+
2466
+ .IncodeCaptureOverlay .IncodeCaptureTopSection .IncodeCaptureTopText {
2467
+ align-items: center;
2468
+ gap: var(--spacing-12, var(--spacing-12, 12px));
2469
+ opacity: 1;
2470
+ transition-property: opacity;
2471
+ transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));
2472
+ transition-duration: var(--tw-duration, var(--default-transition-duration, .15s));
2473
+ --tw-duration: .3s;
2474
+ flex-direction: column;
2475
+ transition-duration: .3s;
2476
+ display: flex;
2477
+ }
2478
+
2479
+ .IncodeCaptureOverlay .IncodeCaptureTopSection .IncodeCaptureTopText.IncodeCaptureTopTextHidden {
2480
+ opacity: 0;
2481
+ }
2482
+
2483
+ .IncodeCaptureOverlay .IncodeCaptureTopSection .IncodeCaptureTopText .IncodeCaptureTopTextTitle {
2484
+ font-family: var(--primitive-typography-family-dm-sans);
2485
+ font-size: var(--typography-headline-h2-size);
2486
+ font-weight: var(--typography-headline-h2-weight);
2487
+ line-height: var(--typography-headline-h2-line-height);
2488
+ letter-spacing: var(--typography-headline-h2-letter-spacing);
2489
+ color: var(--color-text-body-0, var(--text-body-0-static));
2490
+ text-align: center;
2491
+ }
2492
+
2493
+ .IncodeCaptureOverlay .IncodeCaptureTopSection .IncodeCaptureTopText .IncodeCaptureTopTextSubtitle {
2494
+ font-family: var(--primitive-typography-family-dm-sans);
2495
+ font-size: var(--typography-headline-h5-size);
2496
+ font-weight: var(--typography-headline-h5-weight);
2497
+ line-height: var(--typography-headline-h5-line-height);
2498
+ letter-spacing: var(--typography-headline-h5-letter-spacing);
2499
+ color: var(--color-text-body-tertiary, var(--text-body-tertiary));
2500
+ text-align: center;
2501
+ }
2502
+
2503
+ .IncodeCaptureOverlay .IncodeCaptureFrame {
2504
+ --overlay-opacity: .8;
2505
+ box-shadow: 0 0 0 9999px rgba(0, 0, 0, var(--overlay-opacity));
2506
+ transition: max-width .3s ease-out;
2507
+ }
2508
+
2509
+ @media (min-width: 48rem) {
2510
+ .IncodeCaptureOverlay .IncodeCaptureFrame {
2511
+ --overlay-opacity: 1;
2512
+ }
2513
+ }
2514
+
2515
+ .IncodeCaptureOverlay .IncodeCaptureFrame .IncodeCaptureCounter {
2516
+ border-radius: var(--radius-medium, var(--border-radius-medium));
2517
+ background-color: var(--color-countdown-surface-default, var(--countdown-surface-default));
2518
+ padding-inline: var(--spacing-32, var(--spacing-32, 32px));
2519
+ padding-block: var(--spacing-20, var(--spacing-20, 20px));
2520
+ font-family: var(--primitive-typography-family-rethink-sans);
2521
+ font-size: var(--typography-display-d2-size);
2522
+ font-weight: var(--typography-display-d2-weight);
2523
+ line-height: var(--typography-display-d2-line-height);
2524
+ letter-spacing: var(--typography-display-d2-letter-spacing);
2525
+ color: var(--color-countdown-text-default, var(--countdown-text-default));
2526
+ }
2527
+
2528
+ .IncodeCaptureOverlay .IncodeCaptureBottomSection {
2529
+ z-index: 1000;
2530
+ width: 100%;
2531
+ padding-top: var(--spacing-8, var(--spacing-8, 8px));
2532
+ flex-direction: column;
2533
+ flex: 1;
2534
+ align-items: center;
2535
+ display: flex;
2536
+ }
2537
+
2538
+ .IncodeCaptureOverlay .IncodeCaptureBottomSection .IncodeCaptureEncryptionLabel {
2539
+ justify-content: center;
2540
+ align-items: center;
2541
+ gap: var(--spacing-4, var(--spacing-4, 4px));
2542
+ font-family: var(--primitive-typography-family-dm-sans);
2543
+ font-size: var(--typography-body-regular-size);
2544
+ font-weight: var(--typography-body-regular-weight);
2545
+ line-height: var(--typography-body-regular-line-height);
2546
+ letter-spacing: var(--typography-body-regular-letter-spacing);
2547
+ white-space: nowrap;
2548
+ color: var(--color-text-body-0, var(--text-body-0-static));
2549
+ display: flex;
2550
+ }
2551
+
2552
+ .IncodeCaptureOverlay .IncodeCaptureBottomSection .IncodeCaptureHelpButton {
2553
+ right: var(--spacing-24, var(--spacing-24, 24px));
2554
+ bottom: var(--spacing-24, var(--spacing-24, 24px));
2555
+ z-index: 20;
2556
+ pointer-events: auto;
2557
+ position: absolute;
2558
+ }
2559
+
2560
+ .IncodeCaptureOverlay .IncodeCaptureBottomSection .IncodeCaptureHelpButton .IncodeCaptureHelpButtonInner {
2561
+ height: 100%;
2562
+ padding: var(--spacing-0, var(--spacing-none, 0px));
2563
+ justify-content: center;
2564
+ align-items: center;
2565
+ display: flex;
2566
+ }
2567
+
2568
+ .IncodeCaptureOverlay.IncodeCaptureOverlayVertical .IncodeCaptureTopSection {
2569
+ flex: none;
2570
+ margin-top: auto;
2571
+ }
2572
+
2573
+ .IncodeCaptureOverlay.IncodeCaptureOverlayVertical .IncodeCaptureBottomSection {
2574
+ flex: none;
2575
+ margin-bottom: auto;
2576
+ }
2577
+
2578
+ .IncodeIdManualCaptureButton {
2579
+ bottom: var(--spacing-24, var(--spacing-24, 24px));
2580
+ z-index: 100;
2581
+ --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);
2582
+ width: 100%;
2583
+ translate: var(--tw-translate-x) var(--tw-translate-y);
2584
+ justify-content: center;
2585
+ align-items: center;
2586
+ gap: var(--spacing-4, var(--spacing-4, 4px));
2587
+ flex-direction: column;
2588
+ animation: .5s ease-out forwards slideUp;
2589
+ display: flex;
2590
+ position: absolute;
2591
+ left: 50%;
2592
+ }
2593
+
2594
+ .IncodeIdManualCaptureButton .IncodeButtonLink {
2595
+ height: 100%;
2596
+ }
2597
+
2598
+ .IncodeIdManualCaptureButton .IncodeIdManualCaptureTooltipContainer .IncodeIdManualCaptureTooltip {
2599
+ border-radius: var(--radius-medium, var(--border-radius-medium));
2600
+ background-color: var(--color-surface-neutral-900, var(--surface-neutral-900));
2601
+ padding: var(--spacing-16, var(--spacing-16, 16px));
2602
+ }
2603
+
2604
+ .IncodeIdManualCaptureButton .IncodeIdManualCaptureTooltipContainer .IncodeIdManualCaptureTooltip .IncodeIdManualCaptureTooltipList {
2605
+ margin: var(--spacing-0, var(--spacing-none, 0px));
2606
+ padding: var(--spacing-0, var(--spacing-none, 0px));
2607
+ flex-direction: column;
2608
+ align-items: center;
2609
+ list-style-type: none;
2610
+ display: flex;
2611
+ }
2612
+
2613
+ .IncodeIdManualCaptureButton .IncodeIdManualCaptureTooltipContainer .IncodeIdManualCaptureTooltip .IncodeIdManualCaptureTooltipList li {
2614
+ margin: var(--spacing-0, var(--spacing-none, 0px));
2615
+ font-family: var(--primitive-typography-family-dm-sans);
2616
+ font-size: var(--typography-tooltip-size);
2617
+ font-weight: var(--typography-tooltip-weight);
2618
+ line-height: var(--typography-tooltip-line-height);
2619
+ letter-spacing: var(--typography-tooltip-letter-spacing);
2620
+ text-wrap: nowrap;
2621
+ color: var(--color-text-tooltip-neutral, var(--text-tooltip-neutral));
2622
+ }
2623
+
2624
+ .IncodeIdManualCaptureButton .IncodeIdManualCaptureButtonContent .IncodeIdManualCaptureButtonButton svg {
2625
+ transition: filter .2s, transform .2s;
2626
+ }
2627
+
2628
+ .IncodeIdManualCaptureButton .IncodeIdManualCaptureButtonContent:active svg {
2629
+ filter: brightness(.8);
2630
+ transform: scale(.95);
2631
+ }
2632
+
2633
+ @keyframes slideUpAndDown {
2634
+ 0%, 33% {
2635
+ opacity: 0;
2636
+ transform: translateY(100%);
2637
+ }
2638
+
2639
+ 40% {
2640
+ opacity: 1;
2641
+ transform: translateY(0);
2642
+ }
2643
+
2644
+ 60% {
2645
+ opacity: 1;
2646
+ transform: translateY(0);
2647
+ }
2648
+
2649
+ 67%, 100% {
2650
+ opacity: 0;
2651
+ transform: translateY(100%);
2652
+ }
2653
+ }
2654
+
2655
+ .IncodeIdHint {
2656
+ inset: var(--spacing-0, var(--spacing-none, 0px));
2657
+ z-index: 10;
2658
+ justify-content: center;
2659
+ align-items: center;
2660
+ display: flex;
2661
+ position: absolute;
2662
+ overflow: hidden;
2663
+ }
2664
+
2665
+ .IncodeIdHint .IncodeIdHintAnimated {
2666
+ justify-content: center;
2667
+ align-items: center;
2668
+ width: 100%;
2669
+ height: 100%;
2670
+ animation: 9s ease-in-out infinite slideUpAndDown;
2671
+ display: flex;
2672
+ position: relative;
2673
+ }
2674
+
2675
+ .IncodeIdHint .IncodeIdHintAnimated .IncodeIdHintSvg {
2676
+ justify-content: center;
2677
+ align-items: center;
2678
+ width: 100%;
2679
+ height: 100%;
2680
+ display: flex;
2681
+ }
2682
+
2683
+ .IncodeIdHint .IncodeIdHintAnimated .IncodeIdHintSvg svg {
2684
+ object-fit: contain;
2685
+ width: 800px;
2686
+ min-width: 800px;
2687
+ height: 800px;
2688
+ min-height: 800px;
2689
+ }
2690
+
2691
+ .IncodeIdProcessingLayout {
2692
+ width: 100%;
2693
+ height: 100%;
2694
+ padding: var(--spacing-24, var(--spacing-24, 24px));
2695
+ background-color: var(--color-surface-neutral-0, var(--surface-neutral-0));
2696
+ flex-direction: column;
2697
+ justify-content: center;
2698
+ align-items: center;
2699
+ display: flex;
2700
+ }
2701
+
2702
+ .IncodeIdProcessingLayout .IncodeIdProcessingLayoutContent {
2703
+ z-index: 10;
2704
+ flex-direction: column;
2705
+ align-items: center;
2706
+ width: 100%;
2707
+ height: 100%;
2708
+ display: flex;
2709
+ }
2710
+
2711
+ .IncodeIdProcessingLayout .IncodeIdProcessingLayoutContent .IncodeIdProcessingTopArea {
2712
+ justify-content: flex-end;
2713
+ align-items: center;
2714
+ gap: var(--spacing-24, var(--spacing-24, 24px));
2715
+ padding-bottom: var(--spacing-40, var(--spacing-40, 40px));
2716
+ z-index: 10;
2717
+ flex-direction: column;
2718
+ flex: 1;
2719
+ width: 100%;
2720
+ display: flex;
2721
+ }
2722
+
2723
+ .IncodeIdProcessingLayout .IncodeIdProcessingLayoutContent .IncodeCaptureFrame {
2724
+ overflow: hidden;
2725
+ }
2726
+
2727
+ .IncodeIdProcessingLayout .IncodeIdProcessingLayoutContent .IncodeCaptureFrame.IncodeCaptureFrameVertical {
2728
+ width: clamp(180px, 30vh, 274px);
2729
+ }
2730
+
2731
+ .IncodeIdProcessingLayout .IncodeIdProcessingLayoutContent .IncodeCaptureFrame.IncodeCaptureFrameVertical .IncodeIdProcessingOverlay {
2732
+ left: -25%;
2733
+ right: -25%;
2734
+ }
2735
+
2736
+ .IncodeIdProcessingLayout .IncodeIdProcessingLayoutContent .IncodeCaptureFrame .IncodeIdProcessingImage {
2737
+ object-fit: cover;
2738
+ width: 100%;
2739
+ max-width: 100%;
2740
+ height: 100%;
2741
+ max-height: 100%;
2742
+ }
2743
+
2744
+ .IncodeIdProcessingLayout .IncodeIdProcessingLayoutContent .IncodeCaptureFrame .IncodeIdProcessingOverlay {
2745
+ pointer-events: none;
2746
+ z-index: 10;
2747
+ justify-content: center;
2748
+ align-items: center;
2749
+ display: flex;
2750
+ position: absolute;
2751
+ inset: 0 -10%;
2752
+ }
2753
+
2754
+ .IncodeIdProcessingLayout .IncodeIdProcessingLayoutContent .IncodeIdProcessingBottomArea {
2755
+ width: 100%;
2756
+ max-width: 384px;
2757
+ padding-top: var(--spacing-8, var(--spacing-8, 8px));
2758
+ z-index: 10;
2759
+ flex-direction: column;
2760
+ flex: 1;
2761
+ justify-content: space-between;
2762
+ align-items: center;
2763
+ display: flex;
2764
+ }
2765
+
2766
+ .IncodeIdProcessingLayout .IncodeIdProcessingLayoutContent .IncodeIdProcessingBottomArea .IncodeCaptureEncryptionLabel {
2767
+ justify-content: center;
2768
+ align-items: center;
2769
+ gap: var(--spacing-4, var(--spacing-4, 4px));
2770
+ padding-bottom: var(--spacing-12, var(--spacing-12, 12px));
2771
+ font-family: var(--primitive-typography-family-dm-sans);
2772
+ font-size: var(--typography-body-regular-size);
2773
+ font-weight: var(--typography-body-regular-weight);
2774
+ line-height: var(--typography-body-regular-line-height);
2775
+ letter-spacing: var(--typography-body-regular-letter-spacing);
2776
+ white-space: nowrap;
2777
+ color: var(--color-text-body-primary, var(--text-body-primary));
2778
+ display: flex;
2779
+ }
2780
+
2781
+ .IncodeIdProcessingLayout .IncodeAnalyzingContent {
2782
+ flex-direction: column;
2783
+ align-items: center;
2784
+ display: flex;
2785
+ }
2786
+
2787
+ .IncodeIdProcessingLayout .IncodeAnalyzingContent .IncodeAnalyzingProgressBar {
2788
+ background-color: var(--color-surface-neutral-300, var(--surface-neutral-300));
2789
+ width: 143px;
2790
+ height: 8px;
2791
+ margin-bottom: var(--spacing-24, var(--spacing-24, 24px));
2792
+ border-radius: 4px;
2793
+ overflow: hidden;
2794
+ }
2795
+
2796
+ .IncodeIdProcessingLayout .IncodeAnalyzingContent .IncodeAnalyzingProgressBar .IncodeAnalyzingProgressFill {
2797
+ border-radius: var(--radius-small, var(--border-radius-small));
2798
+ background-color: var(--color-icon-status-positive, var(--icon-status-positive-static));
2799
+ height: 100%;
2800
+ transition-property: all;
2801
+ transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));
2802
+ transition-duration: var(--tw-duration, var(--default-transition-duration, .15s));
2803
+ --tw-duration: .5s;
2804
+ --tw-ease: var(--ease-in-out, cubic-bezier(.4, 0, .2, 1));
2805
+ transition-duration: .5s;
2806
+ transition-timing-function: var(--ease-in-out, cubic-bezier(.4, 0, .2, 1));
2807
+ }
2808
+
2809
+ .IncodeIdProcessingLayout .IncodeAnalyzingContent .IncodeAnalyzingTitle {
2810
+ font-family: var(--primitive-typography-family-dm-sans);
2811
+ font-size: var(--typography-headline-h2-size);
2812
+ font-weight: var(--typography-headline-h2-weight);
2813
+ line-height: var(--typography-headline-h2-line-height);
2814
+ letter-spacing: var(--typography-headline-h2-letter-spacing);
2815
+ color: var(--color-text-body-primary, var(--text-body-primary));
2816
+ text-align: center;
2817
+ }
2818
+
2819
+ .IncodeIdProcessingLayout .IncodeAnalyzingLottie {
2820
+ width: 100%;
2821
+ max-width: none;
2822
+ }
2823
+
2824
+ .IncodeIdProcessingLayout .IncodeIdProcessingResultContent {
2825
+ flex-direction: column;
2826
+ align-items: center;
2827
+ display: flex;
2828
+ }
2829
+
2830
+ .IncodeIdProcessingLayout .IncodeIdProcessingResultTitle {
2831
+ font-family: var(--primitive-typography-family-dm-sans);
2832
+ font-size: var(--typography-headline-h2-size);
2833
+ font-weight: var(--typography-headline-h2-weight);
2834
+ line-height: var(--typography-headline-h2-line-height);
2835
+ letter-spacing: var(--typography-headline-h2-letter-spacing);
2836
+ color: var(--color-text-body-primary, var(--text-body-primary));
2837
+ text-align: center;
2838
+ }
2839
+
2840
+ .IncodeIdProcessingLayout .IncodeIdProcessingResultSubtitle {
2841
+ font-family: var(--primitive-typography-family-dm-sans);
2842
+ font-size: var(--typography-headline-h5-size);
2843
+ font-weight: var(--typography-headline-h5-weight);
2844
+ line-height: var(--typography-headline-h5-line-height);
2845
+ letter-spacing: var(--typography-headline-h5-letter-spacing);
2846
+ color: var(--color-text-body-secondary, var(--text-body-secondary));
2847
+ text-align: center;
2848
+ max-width: 300px;
2849
+ }
2850
+
2851
+ .IncodeIdProcessingLayout .IncodeIdProcessingResultButtonContainer {
2852
+ margin-top: var(--spacing-24, var(--spacing-24, 24px));
2853
+ gap: var(--spacing-16, var(--spacing-16, 16px));
2854
+ flex-direction: column;
2855
+ width: 100%;
2856
+ display: flex;
2857
+ }
2858
+
2859
+ .IncodeIdProcessingLayout .IncodeIdProcessingResultAttempts {
2860
+ padding-block: var(--spacing-12, var(--spacing-12, 12px));
2861
+ text-align: center;
2862
+ font-family: var(--primitive-typography-family-dm-sans);
2863
+ font-size: var(--typography-headline-h4-size);
2864
+ font-weight: var(--typography-headline-h4-weight);
2865
+ line-height: var(--typography-headline-h4-line-height);
2866
+ letter-spacing: var(--typography-headline-h4-letter-spacing);
2867
+ color: var(--color-text-body-secondary, var(--text-body-secondary));
2868
+ }
2869
+
2870
+ .IncodeIdError {
2871
+ inset: var(--spacing-0, var(--spacing-none, 0px));
2872
+ z-index: 1000;
2873
+ justify-content: center;
2874
+ align-items: center;
2875
+ gap: var(--spacing-16, var(--spacing-16, 16px));
2876
+ flex-direction: column;
2877
+ width: 100%;
2878
+ height: 100%;
2879
+ display: flex;
2880
+ position: fixed;
2881
+ }
2882
+
2883
+ .IncodeIdErrorMessage {
2884
+ text-align: center;
2885
+ font-size: var(--text-18, var(--primitive-typography-size-18));
2886
+ --tw-font-weight: var(--font-weight-medium, var(--primitive-typography-weight-medium));
2887
+ font-weight: var(--font-weight-medium, var(--primitive-typography-weight-medium));
2888
+ color: var(--color-text-body-0, var(--text-body-0-static));
2889
+ max-width: 350px;
2890
+ margin-bottom: var(--spacing-16, var(--spacing-16, 16px));
2891
+ }
2892
+
2893
+ .IncodeIdExpiredContent {
2894
+ padding-inline: var(--spacing-20, var(--spacing-20, 20px));
2895
+ flex-direction: column;
2896
+ flex: 1;
2897
+ justify-content: center;
2898
+ align-items: center;
2899
+ max-width: 800px;
2900
+ max-height: 840px;
2901
+ margin: auto;
2902
+ display: flex;
2903
+ }
2904
+
2905
+ .IncodeIdExpiredIcon {
2906
+ margin-bottom: var(--spacing-16, var(--spacing-16, 16px));
2907
+ }
2908
+
2909
+ .IncodeIdExpiredTitle {
2910
+ text-align: center;
2911
+ color: var(--color-text-body-primary, var(--text-body-primary));
2912
+ }
2913
+
2914
+ .IncodeIdExpiredSubtitle {
2915
+ font-size: var(--text-14, var(--primitive-typography-size-14));
2916
+ --tw-font-weight: var(--font-weight-normal, 400);
2917
+ font-weight: var(--font-weight-normal, 400);
2918
+ color: var(--color-text-body-secondary, var(--text-body-secondary));
2919
+ text-align: center;
2920
+ max-width: 350px;
2921
+ }
2922
+
2923
+ .IncodeIdExpiredButtonContainer {
2924
+ bottom: 34px;
2925
+ right: var(--spacing-0, var(--spacing-none, 0px));
2926
+ left: var(--spacing-0, var(--spacing-none, 0px));
2927
+ padding-inline: var(--spacing-28, var(--spacing-28, 28px));
2928
+ justify-content: center;
2929
+ display: flex;
2930
+ position: absolute;
2931
+ }
2932
+
2933
+ .IncodeIdCaptureNotification {
2934
+ top: var(--spacing-24, var(--spacing-24, 24px));
2935
+ right: var(--spacing-24, var(--spacing-24, 24px));
2936
+ left: var(--spacing-24, var(--spacing-24, 24px));
2937
+ z-index: 100;
2938
+ max-width: 420px;
2939
+ padding-bottom: var(--spacing-32, var(--spacing-32, 32px));
2940
+ align-items: flex-end;
2941
+ margin: auto;
2942
+ display: flex;
2943
+ position: absolute;
2944
+ }
2945
+
2946
+ .IncodeIdCaptureNotification .IncodeIdCaptureNotificationContent {
2947
+ z-index: 100;
2948
+ border-radius: var(--radius-large, var(--border-radius-large));
2949
+ border-style: var(--tw-border-style);
2950
+ border-width: 2px;
2951
+ border-color: var(--color-border-neutral-300, var(--border-neutral-300));
2952
+ background-color: var(--color-surface-neutral-900-80, var(--surface-neutral-900-80));
2953
+ width: 100%;
2954
+ padding-inline: var(--spacing-20, var(--spacing-20, 20px));
2955
+ display: flex;
2956
+ overflow: hidden;
2957
+ box-shadow: 0 2.079px 36.379px #00000059;
2958
+ }
2959
+
2960
+ .IncodeIdCaptureNotification .IncodeIdCaptureNotificationContent .IncodeIdCaptureNotificationText {
2961
+ justify-content: center;
2962
+ gap: var(--spacing-8, var(--spacing-8, 8px));
2963
+ padding-top: var(--spacing-16, var(--spacing-16, 16px));
2964
+ padding-bottom: var(--spacing-12, var(--spacing-12, 12px));
2965
+ text-align: center;
2966
+ color: var(--color-white, #fff);
2967
+ flex-direction: column;
2968
+ display: flex;
2969
+ }
2970
+
2971
+ .IncodeIdCaptureNotification .IncodeIdCaptureNotificationContent .IncodeIdCaptureNotificationText .IncodeIdCaptureNotificationTitle {
2972
+ font-family: var(--primitive-typography-family-dm-sans);
2973
+ font-size: var(--typography-headline-h3-size);
2974
+ font-weight: var(--typography-headline-h3-weight);
2975
+ line-height: var(--typography-headline-h3-line-height);
2976
+ letter-spacing: var(--typography-headline-h3-letter-spacing);
2977
+ }
2978
+
2979
+ .IncodeIdCaptureNotification .IncodeIdCaptureNotificationContent .IncodeIdCaptureNotificationText .IncodeIdCaptureNotificationDescription {
2980
+ font-family: var(--primitive-typography-family-dm-sans);
2981
+ font-size: var(--typography-headline-h5-size);
2982
+ font-weight: var(--typography-headline-h5-weight);
2983
+ line-height: var(--typography-headline-h5-line-height);
2984
+ letter-spacing: var(--typography-headline-h5-letter-spacing);
2985
+ color: var(--color-text-body-tertiary, var(--text-body-tertiary));
2986
+ }
2987
+
2988
+ .IncodeIdCaptureNotification .IncodeIdCaptureNotificationContent .IncodeIdCaptureNotificationAnimation {
2989
+ justify-content: center;
2990
+ align-items: center;
2991
+ width: auto;
2992
+ height: 130px;
2993
+ display: flex;
2994
+ }
2995
+
2996
+ .IncodeFlow {
2997
+ width: 100%;
2998
+ height: 100%;
2999
+ }
3000
+
3001
+ .IncodeFlowModuleLoading {
3002
+ text-align: center;
3003
+ justify-content: center;
3004
+ align-items: center;
3005
+ height: 100%;
3006
+ display: flex;
3007
+ }
3008
+
3009
+ @property --tw-rotate-x {
3010
+ syntax: "*";
3011
+ inherits: false
3012
+ }
3013
+
3014
+ @property --tw-rotate-y {
3015
+ syntax: "*";
3016
+ inherits: false
3017
+ }
3018
+
3019
+ @property --tw-rotate-z {
3020
+ syntax: "*";
3021
+ inherits: false
3022
+ }
3023
+
3024
+ @property --tw-skew-x {
3025
+ syntax: "*";
3026
+ inherits: false
3027
+ }
3028
+
3029
+ @property --tw-skew-y {
3030
+ syntax: "*";
3031
+ inherits: false
3032
+ }
3033
+
3034
+ @property --tw-border-style {
3035
+ syntax: "*";
3036
+ inherits: false;
3037
+ initial-value: solid;
3038
+ }
3039
+
3040
+ @property --tw-outline-style {
3041
+ syntax: "*";
3042
+ inherits: false;
3043
+ initial-value: solid;
3044
+ }
3045
+
3046
+ @property --tw-blur {
3047
+ syntax: "*";
3048
+ inherits: false
3049
+ }
3050
+
3051
+ @property --tw-brightness {
3052
+ syntax: "*";
3053
+ inherits: false
3054
+ }
3055
+
3056
+ @property --tw-contrast {
3057
+ syntax: "*";
3058
+ inherits: false
3059
+ }
3060
+
3061
+ @property --tw-grayscale {
3062
+ syntax: "*";
3063
+ inherits: false
3064
+ }
3065
+
3066
+ @property --tw-hue-rotate {
3067
+ syntax: "*";
3068
+ inherits: false
3069
+ }
3070
+
3071
+ @property --tw-invert {
3072
+ syntax: "*";
3073
+ inherits: false
3074
+ }
3075
+
3076
+ @property --tw-opacity {
3077
+ syntax: "*";
3078
+ inherits: false
3079
+ }
3080
+
3081
+ @property --tw-saturate {
3082
+ syntax: "*";
3083
+ inherits: false
3084
+ }
3085
+
3086
+ @property --tw-sepia {
3087
+ syntax: "*";
3088
+ inherits: false
3089
+ }
3090
+
3091
+ @property --tw-drop-shadow {
3092
+ syntax: "*";
3093
+ inherits: false
3094
+ }
3095
+
3096
+ @property --tw-drop-shadow-color {
3097
+ syntax: "*";
3098
+ inherits: false
3099
+ }
3100
+
3101
+ @property --tw-drop-shadow-alpha {
3102
+ syntax: "<percentage>";
3103
+ inherits: false;
3104
+ initial-value: 100%;
3105
+ }
3106
+
3107
+ @property --tw-drop-shadow-size {
3108
+ syntax: "*";
3109
+ inherits: false
3110
+ }
3111
+
3112
+ @property --tw-backdrop-blur {
3113
+ syntax: "*";
3114
+ inherits: false
3115
+ }
3116
+
3117
+ @property --tw-backdrop-brightness {
3118
+ syntax: "*";
3119
+ inherits: false
3120
+ }
3121
+
3122
+ @property --tw-backdrop-contrast {
3123
+ syntax: "*";
3124
+ inherits: false
3125
+ }
3126
+
3127
+ @property --tw-backdrop-grayscale {
3128
+ syntax: "*";
3129
+ inherits: false
3130
+ }
3131
+
3132
+ @property --tw-backdrop-hue-rotate {
3133
+ syntax: "*";
3134
+ inherits: false
3135
+ }
3136
+
3137
+ @property --tw-backdrop-invert {
3138
+ syntax: "*";
3139
+ inherits: false
3140
+ }
3141
+
3142
+ @property --tw-backdrop-opacity {
3143
+ syntax: "*";
3144
+ inherits: false
3145
+ }
3146
+
3147
+ @property --tw-backdrop-saturate {
3148
+ syntax: "*";
3149
+ inherits: false
3150
+ }
3151
+
3152
+ @property --tw-backdrop-sepia {
3153
+ syntax: "*";
3154
+ inherits: false
3155
+ }
3156
+
3157
+ @property --tw-ease {
3158
+ syntax: "*";
3159
+ inherits: false
3160
+ }
3161
+
3162
+ @property --tw-translate-x {
3163
+ syntax: "*";
3164
+ inherits: false;
3165
+ initial-value: 0;
3166
+ }
3167
+
3168
+ @property --tw-translate-y {
3169
+ syntax: "*";
3170
+ inherits: false;
3171
+ initial-value: 0;
3172
+ }
3173
+
3174
+ @property --tw-translate-z {
3175
+ syntax: "*";
3176
+ inherits: false;
3177
+ initial-value: 0;
3178
+ }
3179
+
3180
+ @property --tw-leading {
3181
+ syntax: "*";
3182
+ inherits: false
3183
+ }
3184
+
3185
+ @property --tw-font-weight {
3186
+ syntax: "*";
3187
+ inherits: false
3188
+ }
3189
+
3190
+ @property --tw-tracking {
3191
+ syntax: "*";
3192
+ inherits: false
3193
+ }
3194
+
3195
+ @property --tw-duration {
3196
+ syntax: "*";
3197
+ inherits: false
3198
+ }
3199
+
3200
+ @keyframes spin {
3201
+ to {
3202
+ transform: rotate(360deg);
3203
+ }
3204
+ }