* {
  box-sizing:border-box
}
html,body {
  margin:0;
  width:100%;
  min-height:100%;
  overscroll-behavior:none
}
body {
  background:#10182c;
  font-family:Arial,"Microsoft YaHei",sans-serif;
  -webkit-font-smoothing:antialiased
}
button,input,select {
  font:inherit
}
button {
  border:0;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent
}
button:disabled {
  cursor:wait
}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible {
  outline:3px solid #69b8ff;
  outline-offset:3px
}
button {
  color:inherit
}
a {
  color:#3180cf
}
#app {
  --u:calc(100cqw / 390);
  position:relative;
  width:min(100%,480px);
  height:100dvh;
  min-height:570px;
  margin:0 auto;
  overflow:hidden;
  container-type:inline-size;
  background:#fff
}
#app:has(.home),#app:has(.scanner) {
  color:#fff
}
h1,h2,p {
  margin:0
}
.screen {
  position:absolute;
  inset:0;
  overflow:hidden
}
.home {
  background:radial-gradient(ellipse at 108% 110%,#2449bb00 15%,#1f3a8b 78%),linear-gradient(135deg,#1f3a8b 40%,#2247b2);
  color:#fff
}
.home-logo {
  position:absolute;
  top:35.1%;
  left:27.5%;
  width:45%;
  height:auto
}
.home-subtitle {
  position:absolute;
  top:51.75%;
  width:100%;
  text-align:center;
  font-size:calc(12 * var(--u));
  letter-spacing:calc(.4 * var(--u));
  color:#d9e6f1
}
.home-action {
  position:absolute;
  left:5.45%;
  width:89.1%;
  height:calc(54 * var(--u));
  display:flex;
  align-items:center;
  justify-content:center;
  gap:calc(7 * var(--u));
  border-radius:calc(15 * var(--u));
  font-size:calc(16 * var(--u));
  font-weight:600;
  box-shadow:0 calc(5 * var(--u)) calc(9 * var(--u)) #11255b25
}
.home-action svg {
  width:calc(20 * var(--u));
  height:calc(20 * var(--u));
  stroke:currentColor;
  fill:none;
  stroke-width:1.8
}
.verify-action {
  top:54.8%;
  background:linear-gradient(105deg,#0ab58e,#009c79)
}
.login-action {
  top:63.65%;
  background:#ffffff18;
  border:calc(1 * var(--u)) solid #b5c9ed48
}
.particle {
  position:absolute;
  width:calc(11 * var(--u));
  height:calc(11 * var(--u));
  border-radius:50%;
  background:#a3d9fa0e;
  filter:blur(1px);
  animation:drift 6s ease-in-out infinite
}
.particle.one {
  left:24.5%;
  top:24.5%
}
.particle.two {
  left:74.5%;
  top:49.9%;
  width:calc(8 * var(--u));
  height:calc(8 * var(--u))
}
.particle.three {
  left:74%;
  top:75%;
  width:calc(6 * var(--u));
  height:calc(6 * var(--u));
  background:#3ce8b011
}
.home-busy-shade {
  position:absolute;
  inset:0;
  background:#00153e7a
}
.home-spinner {
  position:absolute;
  left:calc(50% - 13 * var(--u));
  top:48.2%;
  width:calc(26 * var(--u));
  height:calc(26 * var(--u))
}
.segmented-spinner {
  position:relative;
  display:inline-block;
  width:calc(34 * var(--u));
  height:calc(34 * var(--u))
}
.segmented-spinner i {
  position:absolute;
  left:45%;
  top:2%;
  width:10%;
  height:25%;
  background:#fff;
  border-radius:99px;
  transform-origin:50% 192%;
  transform:rotate(calc(var(--i) * 45deg));
  opacity:calc(.15 + var(--i) * .105);
  animation:segment .8s linear infinite;
  animation-delay:calc(var(--i) * -.1s)
}
.modal-layer {
  position:absolute;
  inset:0;
  z-index:10;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:calc(21 * var(--u));
  background:#0008
}
.login-layer {
  background:#0008;
  align-items:flex-start;
  padding:0
}
.login-dialog {
  position:absolute;
  top:31.75%;
  left:7.5%;
  width:85%;
  background:#fff;
  color:#151b22;
  border-radius:calc(7 * var(--u));
  overflow:hidden;
  box-shadow:0 calc(7 * var(--u)) calc(14 * var(--u)) #0003
}
.login-heading {
  height:calc(88.5 * var(--u));
  display:flex;
  align-items:center;
  justify-content:center;
  background:linear-gradient(100deg,#5041e5,#982deb);
  color:#fff
}
.login-heading h1 {
  font-size:calc(18 * var(--u));
  font-weight:600
}
.close-login {
  position:absolute;
  right:calc(4 * var(--u));
  top:calc(4 * var(--u));
  width:calc(32 * var(--u));
  height:calc(32 * var(--u));
  border-radius:50%;
  font-size:calc(23 * var(--u));
  font-weight:300;
  line-height:1;
  background:#ffffff29;
  color:#fff
}
.login-form {
  padding:calc(16 * var(--u)) calc(25 * var(--u)) calc(14 * var(--u))
}
.login-intro {
  font-size:calc(13 * var(--u));
  line-height:1.6;
  white-space:nowrap;
  color:#6b7680;
  margin-bottom:calc(17 * var(--u))
}
.email-label {
  font-size:calc(12 * var(--u));
  font-weight:700;
  display:block;
  margin-bottom:calc(8 * var(--u))
}
.email-label span {
  font-size:calc(13 * var(--u));
  margin-right:calc(4 * var(--u))
}
.email-input {
  display:block;
  width:100%;
  height:calc(39 * var(--u));
  background:#f8f9fb;
  border:calc(1.5 * var(--u)) solid #e4e4e5;
  border-radius:calc(11 * var(--u));
  padding:0 calc(18 * var(--u));
  font-size:calc(15 * var(--u));
  color:#29313b;
  box-shadow:inset 0 0 2px #0000000d
}
.email-input::placeholder {
  color:#a1a4a8
}
.login-submit {
  margin-top:calc(7 * var(--u));
  height:calc(54 * var(--u));
  width:100%;
  border-radius:calc(11 * var(--u));
  background:linear-gradient(100deg,#5140e5,#982deb);
  color:#fff;
  font-size:calc(17 * var(--u));
  font-weight:600
}
.scanner {
  background:linear-gradient(90deg,#39438f,#5547d2);
  color:#fff
}
.menu-button {
  position:absolute;
  left:4.5%;
  top:calc(18 * var(--u));
  width:calc(43 * var(--u));
  height:calc(43 * var(--u));
  border-radius:calc(11 * var(--u));
  background:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#3e454e;
  box-shadow:0 calc(2 * var(--u)) calc(4 * var(--u)) #0001;
  z-index:2
}
.menu-button svg {
  width:calc(29 * var(--u));
  height:calc(29 * var(--u));
  stroke-width:3;
  stroke:currentColor;
  fill:none;
  stroke-linecap:round
}
.scanner-logo {
  position:absolute;
  top:6.7%;
  left:30.5%;
  width:36%;
  height:auto
}
.camera-window {
  position:absolute;
  left:2.55%;
  top:18.2%;
  width:94.9%;
  height:36.7%;
  border:calc(1 * var(--u)) solid #babac5;
  border-radius:calc(14 * var(--u));
  background:#222;
  isolation:isolate
}
.camera-image,.camera-video {
  width:100%;
  height:100%;
  object-fit:cover;
  border-radius:inherit;
  position:absolute;
  inset:0
}
.camera-image {
  filter:brightness(.92)
}
.camera-video {
  opacity:0
}
.camera-video.live {
  opacity:1
}
.camera-vignette {
  position:absolute;
  inset:0;
  border-radius:inherit;
  background:#0003;
  pointer-events:none
}
.focus-frame {
  position:absolute;
  left:14.5%;
  top:3%;
  width:71%;
  height:94%;
  border-radius:calc(26 * var(--u));
  box-shadow:0 0 0 calc(60 * var(--u)) #0002;
  clip-path:inset(-1px)
}
.focus-corner {
  position:absolute;
  width:18%;
  height:18%;
  border-color:#80d142;
  border-style:solid;
  border-width:0
}
.focus-corner.tl {
  left:0;
  top:0;
  border-left-width:calc(1.5 * var(--u));
  border-top-width:calc(1.5 * var(--u));
  border-top-left-radius:calc(26 * var(--u))
}
.focus-corner.tr {
  right:0;
  top:0;
  border-right-width:calc(1.5 * var(--u));
  border-top-width:calc(1.5 * var(--u));
  border-top-right-radius:calc(26 * var(--u))
}
.focus-corner.bl {
  left:0;
  bottom:0;
  border-left-width:calc(1.5 * var(--u));
  border-bottom-width:calc(1.5 * var(--u));
  border-bottom-left-radius:calc(26 * var(--u))
}
.focus-corner.br {
  right:0;
  bottom:0;
  border-right-width:calc(1.5 * var(--u));
  border-bottom-width:calc(1.5 * var(--u));
  border-bottom-right-radius:calc(26 * var(--u))
}
.focus-copy {
  position:absolute;
  top:42%;
  left:0;
  right:0;
  padding:calc(9 * var(--u)) 0;
  background:#0009;
  color:#8bea79;
  text-align:center;
  font-size:calc(24 * var(--u));
  font-weight:700;
  line-height:1.1
}
.torch-button {
  position:absolute;
  right:calc(-1 * var(--u));
  bottom:calc(-10 * var(--u));
  width:calc(57 * var(--u));
  height:calc(57 * var(--u));
  border-radius:50%;
  background:#374151;
  color:#fff;
  box-shadow:0 calc(3 * var(--u)) calc(4 * var(--u)) #0002;
  z-index:2
}
.torch-button[aria-pressed=true] {
  background:#ebcf4c;
  color:#253044
}
.torch-button svg {
  width:calc(35 * var(--u));
  height:calc(35 * var(--u));
  fill:none;
  stroke:currentColor;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round
}
.scan-progress {
  position:absolute;
  left:5%;
  top:58.4%;
  height:calc(18 * var(--u));
  width:90%;
  border-radius:99px;
  background:#fff;
  box-shadow:0 calc(1 * var(--u)) calc(5 * var(--u)) #0002
}
.scan-progress span {
  display:block;
  width:0;
  height:100%;
  border-radius:inherit;
  background:linear-gradient(90deg,#8bea79,#4ac54d);
  transition:width .3s
}
.scan-info {
  position:absolute;
  top:66.9%;
  left:calc(50% - 16 * var(--u));
  width:calc(32 * var(--u));
  height:calc(32 * var(--u));
  border-radius:50%;
  background:#fff;
  color:#5149c2;
  font-size:calc(23 * var(--u));
  font-weight:bold;
  font-family:Georgia,serif;
  line-height:calc(32 * var(--u));
  padding:0
}
.scan-message {
  position:absolute;
  top:77%;
  width:100%;
  text-align:center;
  font-size:calc(20 * var(--u));
  font-weight:700;
  line-height:1.4
}
.stop-button {
  position:absolute;
  left:5%;
  bottom:2.8%;
  height:calc(54 * var(--u));
  width:90%;
  border-radius:calc(7 * var(--u));
  background:linear-gradient(95deg,#24a328,#5bd052);
  color:#fff;
  font-size:calc(22 * var(--u));
  font-weight:400
}
.capture-cover {
  position:absolute;
  inset:0;
  z-index:3;
  background:#0007;
  pointer-events:none
}
.capture-spinner {
  position:absolute;
  left:calc(50% - 17 * var(--u));
  top:82%;
  z-index:2
}
.camera-window.capturing .focus-copy {
  display:none
}
.guide-layer {
  background:#0008;
  padding:0
}
.guide-dialog {
  position:absolute;
  top:17%;
  left:3.6%;
  width:92.8%;
  padding:calc(28 * var(--u)) calc(29 * var(--u)) calc(35 * var(--u));
  background:#fff;
  color:#080808;
  border-radius:calc(7 * var(--u));
  box-shadow:0 calc(5 * var(--u)) calc(12 * var(--u)) #0003
}
.guide-step {
  display:grid;
  grid-template-columns:calc(29 * var(--u)) 1fr;
  column-gap:calc(14 * var(--u));
  align-items:start
}
.step-number {
  height:calc(29 * var(--u));
  width:calc(29 * var(--u));
  border-radius:50%;
  background:linear-gradient(110deg,#388cf8,#b341f1);
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:calc(15 * var(--u));
  font-weight:700
}
.guide-step h2 {
  font-size:calc(18 * var(--u));
  line-height:1.5;
  font-weight:700
}
.guide-step p {
  font-size:calc(16 * var(--u));
  line-height:1.55;
  color:#54585a;
  margin-top:calc(5 * var(--u))
}
.guide-step.first {
  margin-bottom:calc(32 * var(--u))
}
.guide-step.second {
  margin-bottom:calc(31 * var(--u))
}
.guide-step.third {
  margin-bottom:calc(17 * var(--u))
}
.guide-qr {
  width:calc(69 * var(--u));
  height:calc(69 * var(--u));
  display:block;
  margin-top:calc(9 * var(--u));
  object-fit:contain
}
.consent-box {
  display:flex;
  gap:calc(11 * var(--u));
  align-items:flex-start;
  border:calc(1 * var(--u)) solid #e6e6e6;
  background:#f9f9fb;
  border-radius:calc(11 * var(--u));
  padding:calc(11 * var(--u));
  font-size:calc(12.5 * var(--u));
  line-height:1.35;
  color:#55595e;
  cursor:pointer;
  margin-left:calc(7 * var(--u));
  margin-right:calc(7 * var(--u))
}
.consent-box input {
  appearance:none;
  flex-shrink:0;
  width:calc(18 * var(--u));
  height:calc(18 * var(--u));
  border:calc(1.3 * var(--u)) solid #8c9093;
  border-radius:calc(5 * var(--u));
  margin:calc(2 * var(--u)) 0 0;
  background:#fff
}
.consent-box input:checked {
  appearance:auto;
  accent-color:#5874f4
}
.consent-box a {
  font-weight:700;
  color:#2479c6;
  text-decoration:underline
}
.guide-loading {
  font-size:calc(14 * var(--u));
  color:#3b4144;
  text-align:center;
  margin-top:calc(16 * var(--u));
  line-height:1.4
}
.guide-progress {
  height:calc(11 * var(--u));
  background:#e7e7eb;
  border-radius:99px;
  margin:calc(9 * var(--u)) calc(7 * var(--u)) 0;
  overflow:hidden
}
.guide-progress span {
  display:block;
  width:73%;
  height:100%;
  background:linear-gradient(90deg,#3283f6,#b146ef);
  transition:width .15s
}
.guide-start {
  background:linear-gradient(100deg,#5041e5,#982deb);
  border-radius:calc(6 * var(--u));
  color:#fff;
  width:100%;
  font-size:calc(15 * var(--u));
  padding:calc(10 * var(--u));
  margin-top:calc(10 * var(--u))
}
.verification {
  background:#0c0000;
  color:#fff
}
.verification-light {
  position:absolute;
  inset:0 0 40%;
  background:url('/assets/watermark-light.jpg') center top/100% 100% no-repeat;
  mask-image:linear-gradient(#000 50%,transparent);
  opacity:.9
}
.verification-grid {
  position:absolute;
  top:18%;
  left:17%;
  width:66%;
  height:43%;
  background-image:linear-gradient(#99bafa06 1px,transparent 1px),linear-gradient(90deg,#99bafa06 1px,transparent 1px);
  background-size:calc(28 * var(--u)) calc(28 * var(--u));
  mask-image:radial-gradient(ellipse,#000,transparent 70%)
}
.verification-logo {
  position:absolute;
  top:32.3%;
  left:46.2%;
  width:7.6%;
  opacity:.58;
  mix-blend-mode:screen
}
.verify-orbit {
  position:absolute;
  left:15.5%;
  top:38.7%;
  width:69%;
  height:calc(88 * var(--u))
}
.fingerprint-node,.qr-node {
  position:absolute;
  left:0;
  top:0;
  width:calc(54 * var(--u));
  height:calc(54 * var(--u));
  border:calc(1 * var(--u)) solid #5452ba55;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#2d235328;
  color:#7b8ee1
}
.fingerprint-node svg,.qr-node svg {
  width:calc(24 * var(--u));
  height:calc(24 * var(--u));
  fill:none;
  stroke:currentColor;
  stroke-width:1.9;
  stroke-linecap:round;
  stroke-linejoin:round
}
.qr-node {
  left:auto;
  right:0;
  top:calc(31 * var(--u))
}
.orbit-spinner {
  position:absolute;
  left:calc(50% - 41 * var(--u));
  top:calc(7 * var(--u));
  width:calc(82 * var(--u));
  height:calc(82 * var(--u));
  border:calc(2 * var(--u)) solid #66778935;
  border-right-color:#809ab9;
  border-bottom-color:#6b809a;
  opacity:.65;
  border-radius:50%;
  animation:spin 1.4s linear infinite
}
.verify-title {
  position:absolute;
  top:53.2%;
  width:100%;
  text-align:center;
  font-size:calc(16 * var(--u));
  font-weight:700;
  line-height:1.4
}
.verify-checklist {
  position:absolute;
  top:58.6%;
  left:15.5%;
  width:80%;
  display:grid;
  gap:calc(12 * var(--u));
  font-size:calc(14 * var(--u));
  line-height:calc(18 * var(--u))
}
.verify-check {
  display:flex;
  gap:calc(9 * var(--u));
  align-items:center;
  color:#77706f
}
.check-dot {
  width:calc(18 * var(--u));
  height:calc(18 * var(--u));
  border:calc(1.2 * var(--u)) solid #6b747f;
  border-radius:50%;
  flex-shrink:0;
  display:flex;
  align-items:center;
  justify-content:center
}
.verify-check.done {
  color:#eee
}
.verify-check.done .check-dot {
  background:#7995b0;
  border-color:#7995b0;
  color:#1b313a;
  font-size:calc(15 * var(--u));
  font-weight:700
}
.verify-check.active {
  color:#c3bcbb
}
.verification.validated .verify-orbit {
  top:38%
}
.verification.validated .verify-title {
  top:51.1%;
  font-size:calc(21 * var(--u))
}
.validated-main {
  position:absolute;
  left:calc(50% - 38 * var(--u));
  top:calc(7 * var(--u));
  width:calc(76 * var(--u));
  height:calc(76 * var(--u));
  border:calc(1 * var(--u)) solid #74859b8c;
  border-radius:50%;
  background:#8696ba30;
  color:#8496b5;
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow:0 0 0 calc(17 * var(--u)) #ffffff02,0 0 0 calc(18 * var(--u)) #ffffff03
}
.validated-main svg {
  width:calc(29 * var(--u));
  height:calc(29 * var(--u));
  fill:none;
  stroke:currentColor;
  stroke-width:1.6;
  stroke-linecap:round
}
.verification.validated .fingerprint-node,.verification.validated .qr-node {
  opacity:.4
}
.validated-copy {
  position:absolute;
  top:56.2%;
  left:18%;
  width:64%;
  text-align:center;
  font-size:calc(15 * var(--u));
  line-height:1.5;
  color:#a8a1a0
}
.redirect-copy {
  position:absolute;
  top:66.9%;
  width:100%;
  text-align:center;
  color:#89817e;
  font-size:calc(15 * var(--u))
}
.redirect-dots {
  display:inline-flex;
  gap:calc(5 * var(--u));
  margin-right:calc(6 * var(--u));
  vertical-align:middle
}
.redirect-dots i {
  width:calc(5 * var(--u));
  height:calc(5 * var(--u));
  background:#7b8faa;
  border-radius:50%;
  animation:blink 1s ease-in-out infinite
}
.redirect-dots i:nth-child(2) {
  animation-delay:.15s
}
.redirect-dots i:nth-child(3) {
  animation-delay:.3s
}
.brand-screen,.page-loading {
  background:#fff;
  color:#111
}
.brand-orbit {
  position:absolute;
  top:46%;
  left:35%;
  width:30%;
  aspect-ratio:1;
  border:calc(1 * var(--u)) solid #c0c0c0;
  border-top-color:#555;
  border-right-color:#aaa;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center
}
.brand-orbit:before {
  content:'';
  position:absolute;
  inset:calc(-1 * var(--u));
  border:calc(1 * var(--u)) solid transparent;
  border-top-color:#555;
  border-radius:50%;
  animation:spin 1.4s linear infinite
}
.brand-orbit img {
  width:63%;
  height:auto
}
.round-close {
  position:absolute;
  top:calc(28 * var(--u));
  right:calc(4 * var(--u));
  width:calc(34 * var(--u));
  height:calc(34 * var(--u));
  background:#fff;
  border-radius:50%;
  color:#111;
  font-size:calc(26 * var(--u));
  line-height:1;
  box-shadow:0 calc(2 * var(--u)) calc(4 * var(--u)) #0001;
  z-index:3
}
.page-loading .blue-spinner {
  position:absolute;
  top:45%;
  left:calc(50% - 29 * var(--u))
}
.blue-spinner {
  width:calc(58 * var(--u));
  height:calc(58 * var(--u));
  border:calc(3.5 * var(--u)) solid #bfddf7;
  border-right-color:#2563eb;
  border-radius:50%;
  animation:spin 1.1s linear infinite
}
.result {
  background:#f1f4f9;
  color:#080808;
  overflow-y:auto;
  scrollbar-width:none
}
.result::-webkit-scrollbar {
  display:none
}
.product-header {
  position:relative;
  height:calc(125 * var(--u));
  background:#fff;
  text-align:center
}
.product-header .menu-button {
  top:calc(18 * var(--u))
}
.indufar-logo {
  position:absolute;
  top:calc(26 * var(--u));
  left:43.5%;
  width:13%;
  height:auto
}
.product-name {
  position:absolute;
  top:calc(83 * var(--u));
  left:0;
  width:100%;
  font-size:calc(14 * var(--u));
  font-weight:700;
  line-height:1.2
}
.language-control {
  position:absolute;
  right:1.9%;
  top:calc(30 * var(--u));
  width:calc(57 * var(--u));
  height:calc(34 * var(--u));
  border:calc(1.5 * var(--u)) solid #363b43;
  border-radius:99px;
  background:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:calc(4 * var(--u));
  font-size:calc(12 * var(--u));
  padding:0
}
.language-control select {
  appearance:none;
  border:0;
  background:transparent;
  color:#151515;
  font-size:inherit;
  width:calc(29 * var(--u));
  padding:0;
  outline-offset:0
}
.language-arrows {
  display:flex;
  flex-direction:column;
  line-height:.6;
  font-size:calc(14 * var(--u));
  pointer-events:none
}
.authentic-banner {
  position:relative;
  height:calc(60 * var(--u));
  width:100%;
  display:flex;
  text-align:left;
  align-items:center;
  gap:calc(7 * var(--u));
  padding:0 calc(14 * var(--u));
  background:#fafbfd;
  color:#080808
}
.authentic-banner img {
  width:calc(43 * var(--u));
  height:calc(43 * var(--u));
  border-radius:50%
}
.authentic-copy {
  display:flex;
  flex-direction:column;
  gap:calc(3 * var(--u))
}
.authentic-label {
  font-size:calc(20 * var(--u));
  font-weight:700;
  line-height:1.1;
  color:#008600
}
.product-code {
  font-size:calc(17 * var(--u));
  font-weight:700;
  line-height:1.3
}
.chevron {
  margin-left:auto;
  width:calc(13 * var(--u));
  height:calc(19 * var(--u));
  stroke:currentColor;
  stroke-width:2.5;
  fill:none;
  stroke-linecap:round;
  stroke-linejoin:round
}
.product-scene {
  width:100%;
  height:auto;
  display:block
}
.product-description {
  padding:calc(8 * var(--u)) calc(18 * var(--u)) 0;
  font-size:calc(11 * var(--u));
  line-height:1.35
}
.product-dose {
  padding:calc(8 * var(--u)) calc(21 * var(--u)) 0;
  font-size:calc(11 * var(--u));
  line-height:1.4
}
.product-actions {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:calc(74 * var(--u));
  padding:calc(28 * var(--u)) 0 calc(15 * var(--u))
}
.product-actions button {
  padding:0;
  width:calc(57 * var(--u));
  height:calc(57 * var(--u));
  border-radius:50%;
  background:transparent
}
.product-actions img {
  width:100%;
  height:100%;
  object-fit:contain
}
.info-dialog {
  position:relative;
  background:#fff;
  color:#080808;
  width:100%;
  border-radius:calc(7 * var(--u));
  padding:calc(23 * var(--u)) calc(22 * var(--u));
  max-height:92%;
  overflow:auto;
  scrollbar-width:thin
}
.info-dialog h2 {
  text-align:center;
  font-size:calc(18 * var(--u));
  line-height:1.3;
  margin:0 0 calc(10 * var(--u));
  font-weight:700
}
.info-dialog p {
  font-size:calc(13 * var(--u));
  line-height:1.5;
  margin:0 0 calc(10 * var(--u))
}
.dialog-close {
  position:absolute;
  right:calc(6 * var(--u));
  top:calc(6 * var(--u));
  width:calc(18 * var(--u));
  height:calc(18 * var(--u));
  padding:0;
  border-radius:50%;
  border:calc(1.3 * var(--u)) solid #080808;
  background:#fff;
  color:#080808;
  font-size:calc(16 * var(--u));
  font-weight:700;
  line-height:calc(14 * var(--u));
  display:flex;
  align-items:center;
  justify-content:center
}
.info-dialog .dialog-code {
  font-size:calc(17 * var(--u));
  font-weight:700;
  text-align:center;
  margin:calc(11 * var(--u)) 0
}
.info-dialog .important {
  font-size:calc(14 * var(--u));
  font-weight:700;
  margin-bottom:0
}
.text-link {
  padding:0;
  background:none;
  color:#3586d8;
  font-weight:700;
  font-size:inherit;
  display:inline
}
.disclaimer-dialog {
  padding:calc(32 * var(--u)) calc(35 * var(--u))
}
.disclaimer-dialog h2 {
  text-align:left;
  font-size:calc(14 * var(--u));
  line-height:1.4;
  margin:0
}
.disclaimer-dialog p {
  font-size:calc(14 * var(--u));
  line-height:1.4;
  margin:0
}
.authenticity-layer {
  align-items:center
}
.camera-error-dialog h2 {
  font-size:calc(18 * var(--u))
}
.camera-error-dialog p {
  font-size:calc(14 * var(--u));
  line-height:1.6
}
.dialog-actions {
  display:grid;
  gap:calc(9 * var(--u));
  margin-top:calc(15 * var(--u))
}
.dialog-actions button,.file-label {
  display:block;
  text-align:center;
  background:#5545db;
  color:#fff;
  border-radius:calc(7 * var(--u));
  padding:calc(12 * var(--u));
  font-size:calc(14 * var(--u));
  cursor:pointer
}
.dialog-actions .secondary {
  background:#eef0f6;
  color:#3c4260
}
.file-input {
  position:absolute;
  width:1px;
  height:1px;
  overflow:hidden;
  clip-path:inset(50%)
}
.toast {
  position:absolute;
  bottom:calc(78 * var(--u));
  left:8%;
  width:84%;
  padding:calc(12 * var(--u));
  border-radius:calc(8 * var(--u));
  background:#111d;
  color:#fff;
  font-size:calc(13 * var(--u));
  text-align:center;
  z-index:30;
  line-height:1.5;
  pointer-events:none
}
.documents {
  background:#d4d3d8;
  color:#282828
}
.document-toolbar {
  height:calc(29 * var(--u));
  display:flex;
  align-items:center;
  gap:calc(7 * var(--u));
  background:#fafafa;
  border-bottom:1px solid #b9b9bb;
  padding:0 calc(6 * var(--u));
  white-space:nowrap;
  font-size:calc(12 * var(--u));
  position:absolute;
  inset:0 0 auto;
  z-index:2
}
.document-toolbar button {
  padding:0;
  background:none;
  display:flex;
  align-items:center;
  justify-content:center;
  width:calc(20 * var(--u));
  height:calc(25 * var(--u));
  font-size:calc(20 * var(--u));
  color:#555
}
.document-toolbar svg {
  width:calc(15 * var(--u));
  height:calc(15 * var(--u));
  fill:none;
  stroke:currentColor;
  stroke-width:1.6;
  stroke-linejoin:round;
  stroke-linecap:round
}
.document-toolbar .page-number {
  width:calc(48 * var(--u));
  height:calc(24 * var(--u));
  border:1px solid #aaa;
  background:#fff;
  border-radius:calc(1 * var(--u));
  text-align:right;
  padding:0 calc(5 * var(--u));
  font-size:calc(12 * var(--u));
  color:#222;
  appearance:textfield
}
.page-number::-webkit-inner-spin-button {
  appearance:none
}
.document-toolbar .spacer {
  flex:1
}
.toolbar-divider {
  width:1px;
  height:calc(16 * var(--u));
  background:#aaa
}
.document-toolbar button.active {
  background:#ded8f5;
  border-radius:3px
}
.document-viewer {
  position:absolute;
  inset:calc(29 * var(--u)) 0 0;
  overflow:auto;
  overscroll-behavior:contain;
  touch-action:pan-x pan-y pinch-zoom
}
.document-pages {
  width:100%;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:calc(10 * var(--u));
  padding:calc(9 * var(--u)) 0 calc(10 * var(--u));
  min-width:100%;
  transform-origin:top center
}
.document-page {
  width:95.5%;
  height:auto;
  display:block;
  background:#fff;
  box-shadow:0 0 1px #aaa;
  flex-shrink:0
}
.documents .round-close {
  top:calc(33 * var(--u))
}
.document-thumbnails {
  position:absolute;
  left:0;
  top:calc(29 * var(--u));
  bottom:0;
  width:28%;
  z-index:2;
  overflow:auto;
  background:#e5e4e8;
  padding:calc(10 * var(--u));
  box-shadow:calc(3 * var(--u)) 0 calc(6 * var(--u)) #0002
}
.document-thumbnails button {
  display:block;
  background:#fff;
  width:100%;
  padding:calc(3 * var(--u));
  margin-bottom:calc(10 * var(--u));
  font-size:calc(11 * var(--u))
}
.document-thumbnails img {
  display:block;
  width:100%
}
.document-tools {
  position:absolute;
  top:calc(31 * var(--u));
  right:calc(4 * var(--u));
  z-index:4;
  background:#fff;
  box-shadow:0 3px 12px #0003;
  border-radius:calc(5 * var(--u));
  padding:calc(10 * var(--u));
  display:grid;
  gap:calc(9 * var(--u));
  font-size:calc(13 * var(--u))
}
.document-tools a {
  color:#333;
  text-decoration:none
}
.gallery {
  overflow-y:auto;
  padding:calc(24 * var(--u));
  background:#f3f5fa;
  color:#283044
}
.gallery h1 {
  font-size:calc(23 * var(--u));
  margin-bottom:calc(9 * var(--u))
}
.gallery p {
  font-size:calc(13 * var(--u));
  line-height:1.6;
  color:#788297;
  margin-bottom:calc(20 * var(--u))
}
.gallery-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:calc(12 * var(--u))
}
.gallery-grid a {
  display:block;
  padding:calc(17 * var(--u)) calc(12 * var(--u));
  background:#fff;
  border:1px solid #e1e5ed;
  border-radius:calc(9 * var(--u));
  color:#343954;
  text-decoration:none;
  font-size:calc(13 * var(--u));
  line-height:1.5
}
.gallery-grid strong {
  display:block;
  color:#634cdc;
  font-size:calc(18 * var(--u));
  margin-bottom:calc(4 * var(--u))
}
@keyframes spin {
  to {
    transform:rotate(360deg)
  }
}
@keyframes blink {
  0%,80%,100% {
    opacity:.3
  }
  40% {
    opacity:1
  }
}
@keyframes segment {
  0%,100% {
    opacity:.15
  }
  50% {
    opacity:1
  }
}
@keyframes drift {
  50% {
    transform:translateY(calc(-8 * var(--u)))
  }
}
/* Measurements refined against the supplied 1280px screenshots. */
.home {
  background:#1f3a8b url('/assets/home-background.png') center/100% 100% no-repeat!important
}
.screen,.modal-layer {
  inset:env(safe-area-inset-top,0px) 0 env(safe-area-inset-bottom,0px)
}
#app:has(.home) {
  background:#1f3a8b
}
#app:has(.scanner) {
  background:#3938ad
}
.verification-glyph {
  width:calc(23 * var(--u));
  height:calc(23 * var(--u));
  object-fit:contain
}
.validated-main .verification-glyph {
  width:calc(31 * var(--u));
  height:calc(31 * var(--u));
  filter:saturate(.25);
  opacity:.8
}
.verification-logo {
  content:url('/assets/watermark-brand.png');
  opacity:1!important
}
.reference-capturing {
  background:linear-gradient(90deg,#22264f,#2e276f)
}
.reference-capturing>:not(.camera-window) {
  filter:brightness(.55)
}
.reference-capturing .capture-cover,.reference-capturing .capture-spinner {
  display:none
}
.reference-capturing .torch-button {
  filter:brightness(.55)
}
.reference-camera .camera-image {
  filter:none
}
.reference-camera :is(.camera-vignette,.focus-frame,.focus-copy) {
  visibility:hidden
}
.reference-camera .torch-button {
  background:url('/assets/torch-reference.png') center/cover
}
.reference-camera .torch-button svg {
  visibility:hidden
}
.home {
  background:linear-gradient(105deg,#1f3a8b 30%,#1e3eab)
}
.home-logo {
  width:42.2%;
  top:34.85%
}
.home-action {
  font-weight:500
}
.login-heading h1,.login-submit {
  font-size:calc(17 * var(--u));
  font-weight:500
}
.login-intro {
  font-size:calc(13.5 * var(--u));
  letter-spacing:calc(.08 * var(--u));
  margin-bottom:calc(15 * var(--u))
}
.email-label {
  margin-bottom:calc(7 * var(--u))
}
.scanner-logo {
  left:30%;
  width:37.8%;
  top:6.5%
}
.guide-step p {
  margin-top:calc(1 * var(--u))
}
.guide-qr {
  width:calc(64 * var(--u));
  height:calc(64 * var(--u));
  margin-top:calc(10 * var(--u))
}
.guide-step.first {
  margin-bottom:calc(31 * var(--u))
}
.guide-step.second {
  margin-bottom:calc(29 * var(--u))
}
.guide-step.third {
  margin-bottom:calc(13 * var(--u))
}
.guide-dialog {
  padding-bottom:calc(33 * var(--u))
}
.guide-progress span {
  width:61%
}
.scanner:has(+.guide-layer) :is(.scan-progress,.scan-info,.scan-message,.stop-button) {
  visibility:hidden
}
.modal-layer:focus {
  outline:0
}
.authenticity-dialog p {
  margin-bottom:calc(6 * var(--u))
}
.authenticity-dialog h2 {
  margin-bottom:calc(8 * var(--u))
}
.authenticity-dialog .important {
  margin-bottom:0
}
.product-actions {
  padding-top:calc(23 * var(--u))
}
.product-code {
  font-size:calc(16.5 * var(--u))
}
.verification-logo {
  opacity:.65;
  mix-blend-mode:normal
}
.verification-light {
  bottom:40%;
  background-size:100% 100%
}
@media(min-width:600px) {
  body {
    display:flex;
    justify-content:center;
    align-items:center;
    min-height:100dvh
  }
  #app {
    height:min(100dvh,976px);
    box-shadow:0 0 70px #0005
  }
}
@media(max-height:680px) {
  .guide-dialog {
    top:7%;
    transform:scale(.9);
    transform-origin:top center
  }
  .login-dialog {
    top:25%
  }
  .scan-message {
    font-size:calc(17 * var(--u))
  }
  .info-dialog {
    max-height:94%
  }
}
@media(prefers-reduced-motion:reduce) {
  *,*:before,*:after {
    animation-duration:2.5s!important;
    transition-duration:.01ms!important
  }
}
.home-logo { left: 27.3%; top: 34.58%; }
.verify-action { top: 54.72%; }
.chevron { width: calc(18 * var(--u)); height: calc(22 * var(--u)); stroke-width: 3; }
.language-arrows { width: calc(7 * var(--u)); height: calc(15 * var(--u)); fill: none; stroke: #151515; stroke-width: 1.25; }
.document-toolbar { gap: calc(6 * var(--u)); }
.document-toolbar button { width: calc(17.5 * var(--u)); }

/* Additional production references: drawer and counterfeit-result dialog. */
.drawer-layer {
  padding: 0;
  justify-content: flex-start;
  background: #0006;
  -webkit-backdrop-filter: blur(calc(3.5 * var(--u)));
  backdrop-filter: blur(calc(3.5 * var(--u)));
}
.drawer {
  position: absolute;
  inset: 0 auto 0 0;
  width: 56.8%;
  background: #fff;
  padding: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  color: #41494f;
  box-shadow: calc(1 * var(--u)) 0 calc(2 * var(--u)) #ffffff50;
}
.drawer-header {
  position: relative;
  height: calc(58.5 * var(--u));
  background: linear-gradient(105deg, #647be8, #6d65c8 45%, #7a5fb7);
}
.drawer-logo {
  display: block;
  position: absolute;
  left: calc(12 * var(--u));
  top: calc(13 * var(--u));
  width: calc(75 * var(--u));
  height: auto;
  margin: 0;
  padding: 0;
  background: transparent;
  border-radius: 0;
}
.drawer button.drawer-close {
  position: absolute;
  right: calc(14 * var(--u));
  top: calc(15 * var(--u));
  width: calc(29 * var(--u));
  height: calc(29 * var(--u));
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: #ffffff29;
  color: #fff;
  font-size: calc(20 * var(--u));
  line-height: 1;
  text-align: center;
}
.drawer-content {
  padding: calc(21 * var(--u)) calc(13 * var(--u));
}
.drawer-group {
  border: calc(1 * var(--u)) solid #f0f0f1;
  border-radius: calc(11 * var(--u));
  overflow: hidden;
  box-shadow: 0 calc(1.2 * var(--u)) calc(2 * var(--u)) #0000001a;
}
.drawer .drawer-item {
  display: flex;
  align-items: center;
  gap: calc(11 * var(--u));
  height: calc(37 * var(--u));
  width: 100%;
  padding: 0 calc(10 * var(--u));
  border: 0;
  background: #fff;
  color: #41494f;
  font-size: calc(12.5 * var(--u));
  font-weight: 400;
  line-height: 1.25;
  text-align: left;
}
.drawer .drawer-item + .drawer-item {
  border-top: calc(1 * var(--u)) solid #f0f0f1;
}
.drawer-icon {
  flex-shrink: 0;
  width: calc(16 * var(--u));
  height: calc(16 * var(--u));
  object-fit: contain;
}
.drawer h2.drawer-section-title {
  margin: calc(22 * var(--u)) 0 calc(9 * var(--u));
  color: #727881;
  font-size: calc(10 * var(--u));
  font-weight: 700;
  line-height: calc(14 * var(--u));
  letter-spacing: calc(.45 * var(--u));
}
.drawer h2.drawer-section-title:nth-of-type(2) {
  margin-top: calc(23 * var(--u));
}
.drawer-item[aria-disabled="true"] {
  cursor: default;
}
.scan-failure-layer {
  padding: calc(14 * var(--u));
  background: #050611b8;
  -webkit-backdrop-filter: blur(calc(4 * var(--u)));
  backdrop-filter: blur(calc(4 * var(--u)));
}
.scan-failure-dialog {
  width: 100%;
  padding: calc(42 * var(--u)) calc(21 * var(--u)) calc(21 * var(--u));
  background: #fff;
  border-radius: calc(22 * var(--u));
  color: #111722;
  text-align: center;
  box-shadow: 0 calc(9 * var(--u)) calc(18 * var(--u)) #00000024;
  max-height: 96%;
  overflow-y: auto;
}
.failure-siren {
  display: block;
  width: calc(44 * var(--u));
  height: calc(54 * var(--u));
  margin: 0 auto calc(14 * var(--u));
  object-fit: contain;
}
.scan-failure-dialog h1 {
  font-size: calc(22 * var(--u));
  line-height: calc(31 * var(--u));
  font-weight: 700;
  margin-bottom: calc(12 * var(--u));
}
.scan-failure-dialog p {
  color: #555b60;
  font-size: calc(14 * var(--u));
  line-height: calc(21.5 * var(--u));
  margin-bottom: calc(20 * var(--u));
}
.failure-understood {
  width: 100%;
  min-height: calc(54 * var(--u));
  padding: calc(10 * var(--u));
  border-radius: 999px;
  background: linear-gradient(100deg, #3583f8, #ac4cf5);
  color: #fff;
  font-size: calc(16 * var(--u));
  font-weight: 700;
  line-height: 1.4;
  box-shadow: 0 calc(5 * var(--u)) calc(8 * var(--u)) #0000001a;
}
html:not([lang="en"]) .verification .verify-title {
  left: 3%;
  width: 94%;
  font-size: calc(14 * var(--u));
}
html:not([lang="en"]) .verification.validated .verify-title {
  font-size: calc(19 * var(--u));
}
html:not([lang="en"]) .verification.validated .validated-copy {
  left: 12%;
  width: 76%;
  font-size: calc(14 * var(--u));
}
html:not([lang="en"]) .verification.validated .redirect-copy {
  top: 71%;
}
html:not([lang="en"]) .scan-message {
  left: 5%;
  width: 90%;
  font-size: calc(18 * var(--u));
}

/* Legal directory and the complete license text from the production recording. */
@font-face {
  font-family: "AuthNow Roboto";
  src: url('/assets/roboto-latin.woff2') format('woff2');
  font-weight: 100 900;
  font-style: normal;
  font-display: block;
}
.information-page {
  font-family: "AuthNow Roboto", Arial, sans-serif;
  color: #080808;
  background: #f9fafc;
}
.information-header {
  position: absolute;
  inset: 0 0 auto;
  height: calc(72 * var(--u));
  z-index: 2;
  background: inherit;
}
.information-header h1 {
  font-family: Arial, sans-serif;
  position: absolute;
  top: calc(41 * var(--u));
  left: 0;
  width: 100%;
  font-size: calc(21.8 * var(--u));
  line-height: calc(31 * var(--u));
  font-weight: 700;
  text-align: center;
  pointer-events: none;
}
.legal-links {
  position: absolute;
  top: calc(85 * var(--u));
  left: 0;
  width: 100%;
  text-align: center;
}
.legal-link {
  display: block;
  margin: 0 auto;
  padding: 0;
  border: 0;
  background: none;
  color: #080808;
  font-size: calc(16 * var(--u));
  line-height: calc(25 * var(--u));
  font-weight: 400;
  text-decoration: underline;
  text-underline-offset: calc(1 * var(--u));
  cursor: default;
}
.licenses-page {
  background: #f6fafb;
  color: #23262a;
}
.license-scroll {
  position: absolute;
  inset: calc(72 * var(--u)) 0 0;
  overflow: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  outline-offset: calc(-3 * var(--u));
}
.license-scroll::-webkit-scrollbar {
  display: none;
}
.license-scrollbar {
  position: absolute;
  top: calc(71 * var(--u));
  bottom: calc(2 * var(--u));
  right: calc(1.5 * var(--u));
  width: calc(2 * var(--u));
  pointer-events: none;
  z-index: 3;
}
.license-scrollbar span {
  display: block;
  width: 100%;
  background: #979797;
  border-radius: 999px;
}
.license-content {
  font-family: Arial, sans-serif;
  padding: calc(20 * var(--u)) calc(21.5 * var(--u)) calc(52 * var(--u));
  font-size: calc(14.4 * var(--u));
  line-height: calc(21.1 * var(--u));
  font-weight: 400;
  overflow-wrap: break-word;
}
.license-content strong {
  font-weight: 700;
}
.license-content p {
  margin: 0 0 calc(7 * var(--u));
}
.license-content a {
  color: inherit;
  text-decoration: none;
}
.license-section-heading {
  font-family: "AuthNow Roboto", Arial, sans-serif;
  display: flex;
  align-items: center;
  gap: calc(5 * var(--u));
  margin: 0 0 calc(7 * var(--u));
  font-size: calc(15 * var(--u));
  line-height: calc(22 * var(--u));
  font-weight: 700;
}
.license-section-heading img {
  display: block;
  flex-shrink: 0;
  width: calc(18 * var(--u));
  height: calc(18 * var(--u));
  object-fit: contain;
}
.license-free-use,.license-apache {
  margin-top: calc(32 * var(--u));
}
.license-apache {
  margin-top: calc(39 * var(--u));
}
.apache-title {
  font-family: "AuthNow Roboto", Arial, sans-serif;
  margin: 0 0 calc(36 * var(--u));
  font-size: calc(15.25 * var(--u));
  line-height: calc(21.1 * var(--u));
  font-weight: 700;
}
.license-line {
  min-height: calc(21.1 * var(--u));
  margin-bottom: calc(7 * var(--u));
  white-space: pre-wrap;
  overflow-wrap: break-word;
}
.license-mit {
  margin-top: calc(28 * var(--u));
}
.license-mit .license-line:last-child {
  font-family: "AuthNow Roboto", Arial, sans-serif;
}
.license-contact {
  margin-top: calc(27 * var(--u));
}
.license-content .license-contact-intro {
  margin-bottom: calc(20 * var(--u));
}
.license-content .license-contact-address {
  margin-bottom: 0;
}
