/* apps/web/src/reused-ux/auth.css */
.dhv-auth-invite {
}
.dhv-auth-invite__title {
  left: 0;
  width: 100%;
  top: calc(var(--y) * var(--u));
  padding: 0 5%;
  font-weight: 700;
  font-size: calc(var(--fs) * var(--u));
  line-height: 1.2;
  color: var(--dhv-color-font-title);
  text-align: center;
  white-space: nowrap;
}
.dhv-auth-invite__helper {
  left: 0;
  width: 100%;
  top: calc(var(--y) * var(--u));
  padding: 0 5%;
  font-weight: 400;
  font-size: calc(var(--fs) * var(--u));
  line-height: 1.2;
  color: var(--dhv-color-font-contents);
  text-align: center;
  white-space: nowrap;
}
.dhv-auth-invite__helper.is-error {
  color: var(--dhv-color-error);
}
.dhv-auth-invite__code {
  left: calc(var(--x) * var(--u));
  top: calc(var(--y) * var(--u));
  display: flex;
  gap: calc(var(--gap) * var(--u));
}
.dhv-auth-invite__code input {
  width: calc(var(--box) * var(--u));
  height: calc(var(--box) * var(--u));
  border-radius: calc(10 * var(--u));
  border: calc(1 * var(--u)) solid var(--dhv-color-border);
  background: var(--dhv-color-surface);
  color: var(--dhv-color-font-title);
  font-family: inherit;
  font-weight: 600;
  font-size: calc(var(--digitfs) * var(--u));
  text-align: center;
  padding: 0;
}
.dhv-auth-invite__code input:placeholder-shown {
  text-align: left;
  font-size: max(16px, calc(var(--digitfs) * 0.5 * var(--u)));
  padding-left: calc(10 * var(--u));
}
.dhv-auth-invite__code input:focus,
.dhv-auth-invite__code input.is-focus {
  outline: none;
  border: var(--dhv-input-focus-border-width, calc(var(--focusbw) * var(--u))) solid var(--dhv-color-input-focused);
  box-shadow: var(--dhv-shadow-input-focused);
}
.dhv-auth-invite__group {
  left: 0;
  right: 0;
  top: calc(var(--ctop) * var(--u));
  bottom: calc(var(--gbot) * var(--u));
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.dhv-auth-invite__group .dhv-auth-invite__helper {
  margin-top: calc(var(--hgap, 16) * var(--u));
}
.dhv-auth-invite__cta {
  left: calc(var(--x) * var(--u));
  bottom: calc(var(--by) * var(--u));
  width: calc(var(--w) * var(--u));
  height: calc(var(--h) * var(--u));
  border: none;
  border-radius: calc(10 * var(--u));
  background: var(--dhv-color-primary-cta);
  color: var(--dhv-color-primary-btn-text);
  font-family: inherit;
  font-weight: var(--fw, 600);
  font-size: calc(var(--fs) * var(--u));
  display: flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
  cursor: pointer;
}
.dhv-auth-invite__cta:disabled {
  background: var(--dhv-color-disabled);
  cursor: default;
}
.dhv-auth-invite__cta:focus-visible {
  outline: 2px solid var(--dhv-color-focused);
  outline-offset: 2px;
}
.dhv-auth-invite__powered {
  left: calc(var(--x) * var(--u));
  bottom: calc(var(--by) * var(--u));
  width: calc(var(--w) * var(--u));
  font-weight: 300;
  font-size: calc(var(--fs) * var(--u));
  line-height: 1.2;
  text-align: center;
  color: var(--dhv-color-font-contents);
  white-space: nowrap;
}
[data-dhv-layout=desktop] .dhv-auth-invite__title {
  --x:439;
  --y:60;
  --w:489;
  --fs:45;
}
[data-dhv-layout=desktop] .dhv-auth-invite__code {
  --x:335;
  --y:153;
  --gap:24;
  --box:96;
  --digitfs:48;
  --focusbw:3;
}
[data-dhv-layout=desktop] .dhv-auth-invite__helper {
  --x:485;
  --y:265;
  --w:397;
  --fs:24;
}
[data-dhv-layout=desktop] .dhv-auth-invite__cta {
  --x:453;
  --by:74;
  --w:460;
  --h:82;
  --fs:34;
  --fw:600;
}
[data-dhv-layout=desktop] .dhv-auth-invite__powered {
  --x:614;
  --by:27;
  --w:138;
  --fs:14;
}
[data-dhv-layout=tablet-landscape] .dhv-auth-invite__title {
  --x:268;
  --y:60;
  --w:489;
  --fs:45;
}
[data-dhv-layout=tablet-landscape] .dhv-auth-invite__code {
  --x:164;
  --y:153;
  --gap:24;
  --box:96;
  --digitfs:48;
  --focusbw:3;
}
[data-dhv-layout=tablet-landscape] .dhv-auth-invite__helper {
  --x:314;
  --y:265;
  --w:397;
  --fs:24;
}
[data-dhv-layout=tablet-landscape] .dhv-auth-invite__cta {
  --x:282;
  --by:68;
  --w:460;
  --h:82;
  --fs:34;
  --fw:600;
}
[data-dhv-layout=tablet-landscape] .dhv-auth-invite__powered {
  --x:443;
  --by:27;
  --w:138;
  --fs:14;
}
[data-dhv-layout=tablet-portrait] .dhv-auth-invite__title {
  --x:140;
  --y:60;
  --w:489;
  --fs:45;
}
[data-dhv-layout=tablet-portrait] .dhv-auth-invite__code {
  --x:46;
  --y:153;
  --gap:20;
  --box:96;
  --digitfs:48;
  --focusbw:3;
}
[data-dhv-layout=tablet-portrait] .dhv-auth-invite__helper {
  --x:186;
  --y:265;
  --w:397;
  --fs:24;
}
[data-dhv-layout=tablet-portrait] .dhv-auth-invite__cta {
  --x:154;
  --by:88;
  --w:460;
  --h:82;
  --fs:34;
  --fw:600;
}
[data-dhv-layout=tablet-portrait] .dhv-auth-invite__powered {
  --x:315;
  --by:47;
  --w:138;
  --fs:14;
}
[data-dhv-layout=mobile] .dhv-auth-invite__title {
  --x:65;
  --y:60;
  --w:261;
  --fs:24;
}
[data-dhv-layout=mobile] .dhv-auth-invite__code {
  --x:36;
  --y:129;
  --gap:8;
  --box:47;
  --digitfs:28;
  --focusbw:2;
}
[data-dhv-layout=mobile] .dhv-auth-invite__helper {
  --x:63;
  --y:200;
  --w:265;
  --fs:16;
  --hgap: 24;
}
[data-dhv-layout=mobile] .dhv-auth-invite__cta {
  --x:33;
  --by:44;
  --w:324;
  --h:52;
  --fs:21;
  --fw:500;
}
[data-dhv-layout=mobile] .dhv-auth-invite__powered {
  --x:126;
  --by:13;
  --w:138;
  --fs:14;
}
.dhv-auth-login__title {
  left: calc(var(--x) * var(--u));
  top: calc(var(--y) * var(--u));
  width: calc(var(--w) * var(--u));
  font-weight: 700;
  font-size: calc(var(--fs) * var(--u));
  line-height: 1.2;
  color: var(--dhv-color-font-title);
  white-space: nowrap;
}
.dhv-auth-login__label {
  left: calc(var(--x) * var(--u));
  font-weight: 700;
  font-size: calc(var(--fs) * var(--u));
  line-height: 1.3;
  color: var(--dhv-color-font-contents);
  white-space: nowrap;
}
.dhv-auth-login__input {
  left: calc(var(--x) * var(--u));
  width: calc(var(--w) * var(--u));
  height: calc(var(--h) * var(--u));
  border-radius: calc(10 * var(--u));
  border: calc(1 * var(--u)) solid var(--dhv-color-border);
  background: var(--dhv-color-surface);
  color: var(--dhv-color-font-title);
  font-family: inherit;
  font-size: max(16px, calc(var(--ph) * var(--u)));
  padding: 0 calc(var(--padr, var(--padl)) * var(--u)) 0 calc(var(--padl) * var(--u));
}
.dhv-auth-login__input::placeholder {
  color: var(--dhv-color-font-contents);
  opacity: 0.7;
}
.dhv-auth-login__input:focus {
  outline: none;
  border: var(--dhv-input-focus-border-width, calc(var(--focusbw) * var(--u))) solid var(--dhv-color-input-focused);
  box-shadow: var(--dhv-shadow-input-focused);
}
.dhv-auth-login__label--id,
.dhv-auth-login__input--id {
  top: calc(var(--y) * var(--u));
}
.dhv-auth-login__label--pw,
.dhv-auth-login__input--pw,
.dhv-auth-login__eye {
  top: calc((var(--y) + var(--eshift, 0)) * var(--u));
}
.dhv-auth-login__eye {
  left: calc(var(--x) * var(--u));
  width: calc(var(--w) * var(--u));
  height: calc(var(--w) * var(--u));
  border: none;
  background: none;
  padding: 0;
  cursor: pointer;
  color: var(--dhv-color-font-title);
  display: flex;
  align-items: center;
  justify-content: center;
}
.dhv-auth-login__eye img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}
.dhv-auth-login__eye:focus-visible {
  outline: 2px solid var(--dhv-color-focused);
  outline-offset: 2px;
  border-radius: 6px;
}
.dhv-auth-login__error {
  left: calc(var(--x) * var(--u));
  top: calc(var(--y) * var(--u));
  width: calc(var(--w) * var(--u));
  font-weight: 400;
  font-size: calc(var(--fs) * var(--u));
  line-height: 1.3;
  color: var(--dhv-color-error);
  white-space: nowrap;
  display: none;
}
.dhv-auth-login.is-error .dhv-auth-login__error {
  display: block;
}
.dhv-auth-login__cta {
  left: calc(var(--x) * var(--u));
  bottom: calc(var(--by) * var(--u));
  width: calc(var(--w) * var(--u));
  height: calc(var(--h) * var(--u));
  border: none;
  border-radius: calc(10 * var(--u));
  background: var(--dhv-color-primary-cta);
  color: var(--dhv-color-primary-btn-text);
  font-family: inherit;
  font-weight: var(--fw, 600);
  font-size: calc(var(--fs) * var(--u));
  display: flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
  cursor: pointer;
}
.dhv-auth-login__cta:disabled {
  background: var(--dhv-color-disabled);
  cursor: default;
}
.dhv-auth-login__cta:focus-visible {
  outline: 2px solid var(--dhv-color-focused);
  outline-offset: 2px;
}
.dhv-auth-login__powered {
  left: calc(var(--x) * var(--u));
  bottom: calc(var(--by) * var(--u));
  width: calc(var(--w) * var(--u));
  font-weight: 300;
  font-size: calc(var(--fs) * var(--u));
  line-height: 1.2;
  text-align: center;
  color: var(--dhv-color-font-contents);
  white-space: nowrap;
}
[data-dhv-layout=desktop] .dhv-auth-login__title {
  --x:612;
  --y:60;
  --w:143;
  --fs:45;
}
[data-dhv-layout=desktop] .dhv-auth-login__label--id {
  --x:453;
  --y:153;
  --fs:24;
}
[data-dhv-layout=desktop] .dhv-auth-login__input--id {
  --x:453;
  --y:198;
  --w:460;
  --h:88;
  --ph:28;
  --padl:28;
  --focusbw:3;
}
[data-dhv-layout=desktop] .dhv-auth-login__error {
  --x:583;
  --y:302;
  --w:200;
  --fs:24;
}
[data-dhv-layout=desktop] .dhv-auth-login__label--pw {
  --x:453;
  --y:334;
  --fs:24;
}
[data-dhv-layout=desktop] .dhv-auth-login__input--pw {
  --x:453;
  --y:379;
  --w:460;
  --h:88;
  --ph:28;
  --padl:28;
  --padr:72;
  --focusbw:3;
}
[data-dhv-layout=desktop] .dhv-auth-login__eye {
  --x:841;
  --y:401;
  --w:44;
}
[data-dhv-layout=desktop] .dhv-auth-login__cta {
  --x:453;
  --by:74;
  --w:460;
  --h:82;
  --fs:34;
  --fw:600;
}
[data-dhv-layout=desktop] .dhv-auth-login__powered {
  --x:614;
  --by:27;
  --w:138;
  --fs:14;
}
[data-dhv-layout=desktop] .dhv-auth-login.is-error {
  --eshift:21;
}
[data-dhv-layout=tablet-landscape] .dhv-auth-login__title {
  --x:441;
  --y:60;
  --w:143;
  --fs:45;
}
[data-dhv-layout=tablet-landscape] .dhv-auth-login__label--id {
  --x:282;
  --y:153;
  --fs:24;
}
[data-dhv-layout=tablet-landscape] .dhv-auth-login__input--id {
  --x:282;
  --y:198;
  --w:460;
  --h:88;
  --ph:28;
  --padl:28;
  --focusbw:3;
}
[data-dhv-layout=tablet-landscape] .dhv-auth-login__error {
  --x:412;
  --y:302;
  --w:200;
  --fs:24;
}
[data-dhv-layout=tablet-landscape] .dhv-auth-login__label--pw {
  --x:282;
  --y:334;
  --fs:24;
}
[data-dhv-layout=tablet-landscape] .dhv-auth-login__input--pw {
  --x:282;
  --y:379;
  --w:460;
  --h:88;
  --ph:28;
  --padl:28;
  --padr:72;
  --focusbw:3;
}
[data-dhv-layout=tablet-landscape] .dhv-auth-login__eye {
  --x:670;
  --y:401;
  --w:44;
}
[data-dhv-layout=tablet-landscape] .dhv-auth-login__cta {
  --x:282;
  --by:68;
  --w:460;
  --h:82;
  --fs:34;
  --fw:600;
}
[data-dhv-layout=tablet-landscape] .dhv-auth-login__powered {
  --x:443;
  --by:27;
  --w:138;
  --fs:14;
}
[data-dhv-layout=tablet-landscape] .dhv-auth-login.is-error {
  --eshift:21;
}
[data-dhv-layout=tablet-portrait] .dhv-auth-login__title {
  --x:313;
  --y:60;
  --w:143;
  --fs:45;
}
[data-dhv-layout=tablet-portrait] .dhv-auth-login__label--id {
  --x:154;
  --y:153;
  --fs:24;
}
[data-dhv-layout=tablet-portrait] .dhv-auth-login__input--id {
  --x:154;
  --y:198;
  --w:460;
  --h:88;
  --ph:28;
  --padl:28;
  --focusbw:3;
}
[data-dhv-layout=tablet-portrait] .dhv-auth-login__error {
  --x:284;
  --y:302;
  --w:200;
  --fs:24;
}
[data-dhv-layout=tablet-portrait] .dhv-auth-login__label--pw {
  --x:154;
  --y:334;
  --fs:24;
}
[data-dhv-layout=tablet-portrait] .dhv-auth-login__input--pw {
  --x:154;
  --y:379;
  --w:460;
  --h:88;
  --ph:28;
  --padl:28;
  --padr:72;
  --focusbw:3;
}
[data-dhv-layout=tablet-portrait] .dhv-auth-login__eye {
  --x:542;
  --y:401;
  --w:44;
}
[data-dhv-layout=tablet-portrait] .dhv-auth-login__cta {
  --x:154;
  --by:88;
  --w:460;
  --h:82;
  --fs:34;
  --fw:600;
}
[data-dhv-layout=tablet-portrait] .dhv-auth-login__powered {
  --x:315;
  --by:47;
  --w:138;
  --fs:14;
}
[data-dhv-layout=tablet-portrait] .dhv-auth-login.is-error {
  --eshift:21;
}
[data-dhv-layout=mobile] .dhv-auth-login__title {
  --x:157;
  --y:60;
  --w:76;
  --fs:24;
}
[data-dhv-layout=mobile] .dhv-auth-login__label--id {
  --x:33;
  --y:129;
  --fs:16;
}
[data-dhv-layout=mobile] .dhv-auth-login__input--id {
  --x:33;
  --y:156;
  --w:324;
  --h:47;
  --ph:16;
  --padl:18;
  --focusbw:2;
}
[data-dhv-layout=mobile] .dhv-auth-login__error {
  --x:128;
  --y:211;
  --w:134;
  --fs:16;
}
[data-dhv-layout=mobile] .dhv-auth-login__label--pw {
  --x:33;
  --y:227;
  --fs:16;
}
[data-dhv-layout=mobile] .dhv-auth-login__input--pw {
  --x:33;
  --y:254;
  --w:324;
  --h:47;
  --ph:16;
  --padl:18;
  --padr:42;
  --focusbw:2;
}
[data-dhv-layout=mobile] .dhv-auth-login__eye {
  --x:315;
  --y:266;
  --w:24;
  --egap: 32;
}
[data-dhv-layout=mobile] .dhv-auth-login__cta {
  --x:33;
  --by:44;
  --w:324;
  --h:52;
  --fs:21;
  --fw:500;
}
[data-dhv-layout=mobile] .dhv-auth-login__powered {
  --x:126;
  --by:13;
  --w:138;
  --fs:14;
}
[data-dhv-layout=mobile] .dhv-auth-login.is-error {
  --eshift:19;
}
[data-dhv-layout=desktop] .dhv-auth-invite__group {
  --gbot: 156;
  --ctop: 113;
}
[data-dhv-layout=tablet-landscape] .dhv-auth-invite__group {
  --gbot: 150;
  --ctop: 113;
}
[data-dhv-layout=tablet-portrait] .dhv-auth-invite__group {
  --gbot: 170;
  --ctop: 113;
}
[data-dhv-layout=mobile] .dhv-auth-invite__group {
  --gbot: 96;
  --ctop: 89;
}

/* apps/web/src/reused-ux/spinner.css */
.dhv-spinner {
  display: inline-block;
  position: relative;
  width: 1.15em;
  height: 1.15em;
  vertical-align: middle;
}
.dhv-spinner i {
  position: absolute;
  inset: 0;
}
.dhv-spinner i::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 0;
  width: 0.13em;
  height: 0.34em;
  margin-left: -0.065em;
  border-radius: 0.065em;
  background: currentColor;
  opacity: 0.22;
  animation: dhv-spoke 0.8s linear infinite;
}
.dhv-spinner i:nth-child(1) {
  transform: rotate(0deg);
}
.dhv-spinner i:nth-child(2) {
  transform: rotate(45deg);
}
.dhv-spinner i:nth-child(3) {
  transform: rotate(90deg);
}
.dhv-spinner i:nth-child(4) {
  transform: rotate(135deg);
}
.dhv-spinner i:nth-child(5) {
  transform: rotate(180deg);
}
.dhv-spinner i:nth-child(6) {
  transform: rotate(225deg);
}
.dhv-spinner i:nth-child(7) {
  transform: rotate(270deg);
}
.dhv-spinner i:nth-child(8) {
  transform: rotate(315deg);
}
.dhv-spinner i:nth-child(1)::before {
  animation-delay: -0.8s;
}
.dhv-spinner i:nth-child(2)::before {
  animation-delay: -0.7s;
}
.dhv-spinner i:nth-child(3)::before {
  animation-delay: -0.6s;
}
.dhv-spinner i:nth-child(4)::before {
  animation-delay: -0.5s;
}
.dhv-spinner i:nth-child(5)::before {
  animation-delay: -0.4s;
}
.dhv-spinner i:nth-child(6)::before {
  animation-delay: -0.3s;
}
.dhv-spinner i:nth-child(7)::before {
  animation-delay: -0.2s;
}
.dhv-spinner i:nth-child(8)::before {
  animation-delay: -0.1s;
}
@keyframes dhv-spoke {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0.22;
  }
}
@media (prefers-reduced-motion: reduce) {
  .dhv-spinner i::before {
    animation: none;
    opacity: 0.5;
  }
}
.is-loading {
  pointer-events: none;
}

/* apps/web/src/reused-ux/splash.css */
.dhv-splash__main {
  pointer-events: none;
  left: 0;
  right: 0;
  top: 0;
  bottom: calc(var(--fz) * var(--u));
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: calc(var(--gap, 18) * var(--u));
}
.dhv-splash__logo {
  flex: none;
  width: calc(var(--w) * var(--u));
  height: calc(var(--h) * var(--u));
}
.dhv-splash__loading {
  position: absolute;
  left: 0;
  right: 0;
  bottom: calc(var(--ldby) * var(--u));
  display: flex;
  align-items: center;
  justify-content: center;
}
.dhv-splash__text {
  font-weight: 300;
  font-size: calc(16 * var(--u));
  line-height: 1.2;
  letter-spacing: -.02em;
  color: var(--dhv-color-font-contents);
  white-space: nowrap;
}
.dhv-splash__error {
  flex: none;
  max-width: 88%;
  text-align: center;
  font-weight: 400;
  font-size: calc(16 * var(--u));
  line-height: 1.5;
  color: var(--dhv-color-font-title);
}
.dhv-splash__dots {
  display: inline;
  font-size: 1.5em;
  line-height: 0;
  vertical-align: baseline;
}
.dhv-splash__dots {
  --dot-off: #CFCFCF;
  --dot-on: var(--dhv-color-font-title);
}
.dhv-ux[data-dhv-theme=dark] .dhv-splash__dots {
  --dot-off: #3A4250;
  --dot-on: var(--dhv-color-font-title);
}
.dhv-splash__dots i {
  font-style: normal;
  color: var(--dot-on);
  opacity: .28;
  will-change: opacity;
  animation: dhv-dot-progress 1.2s infinite steps(1);
}
.dhv-splash__dots i:nth-child(2) {
  animation-delay: .4s;
}
.dhv-splash__dots i:nth-child(3) {
  animation-delay: .8s;
}
@keyframes dhv-dot-progress {
  0%, 33.32% {
    opacity: 1;
  }
  33.33%, to {
    opacity: .28;
  }
}
.dhv-splash__powered {
  left: calc(var(--x) * var(--u));
  bottom: calc(var(--by) * var(--u));
  width: calc(var(--w) * var(--u));
  font-weight: 300;
  font-size: calc(14 * var(--u));
  line-height: 1.15;
  text-align: center;
  color: var(--dhv-color-font-contents);
  white-space: nowrap;
}
[data-dhv-layout=desktop] .dhv-splash__logo {
  --w:361;
  --h:65;
}
[data-dhv-layout=desktop] .dhv-splash__main {
  --fz:39;
}
[data-dhv-layout=desktop] .dhv-splash__powered {
  --x:614;
  --by:22;
  --w:138;
}
[data-dhv-layout=desktop] .dhv-splash__loading {
  --ldby: 87;
}
[data-dhv-layout=tablet-landscape] .dhv-splash__logo {
  --w:361;
  --h:65;
}
[data-dhv-layout=tablet-landscape] .dhv-splash__main {
  --fz:45;
}
[data-dhv-layout=tablet-landscape] .dhv-splash__powered {
  --x:443;
  --by:28;
  --w:138;
}
[data-dhv-layout=tablet-landscape] .dhv-splash__loading {
  --ldby: 93;
}
[data-dhv-layout=tablet-portrait] .dhv-splash__logo {
  --w:361;
  --h:65;
}
[data-dhv-layout=tablet-portrait] .dhv-splash__main {
  --fz:65;
}
[data-dhv-layout=tablet-portrait] .dhv-splash__powered {
  --x:315;
  --by:48;
  --w:138;
}
[data-dhv-layout=tablet-portrait] .dhv-splash__loading {
  --ldby: 113;
}
[data-dhv-layout=mobile] .dhv-splash__logo {
  --w:270;
  --h:49;
  margin: auto;
}
[data-dhv-layout=mobile] .dhv-splash__main {
  --fz:31;
  justify-content: flex-start;
  gap: 0;
}
[data-dhv-layout=mobile] .dhv-splash__error {
  margin: auto auto calc(48 * var(--u));
}
[data-dhv-layout=mobile] .dhv-splash__powered {
  --x:126;
  --by:14;
  --w:138;
}
[data-dhv-layout=mobile] .dhv-splash__loading {
  --ldby: 79;
}
@keyframes dhv-dot {
  0%, 60%, to {
    opacity: .2;
    transform: scale(.7);
  }
  30% {
    opacity: 1;
    transform: scale(1);
  }
}
@media (prefers-reduced-motion: reduce) {
  .dhv-splash__dots i {
    animation: none;
  }
  .dhv-splash__dots i:first-child {
    color: var(--dot-on);
  }
}
@keyframes dhv-spoke {
  0% {
    opacity: 1;
  }
  to {
    opacity: .22;
  }
}
@keyframes dhv-sweep {
  0% {
    top: var(--swy0);
    opacity: 0;
  }
  12% {
    opacity: .88;
  }
  84% {
    top: var(--swy1);
    opacity: .88;
  }
  to {
    top: var(--swy1);
    opacity: 0;
  }
}
@keyframes dhv-sk-pulse {
  0%, to {
    opacity: 1;
  }
  50% {
    opacity: .45;
  }
}

/* apps/web/src/reused-ux/analyzing.css */
@keyframes dhv-dot-progress {
  0%, 33.32% {
    opacity: 1;
  }
  33.33%, to {
    opacity: .28;
  }
}
@keyframes dhv-dot {
  0%, 60%, to {
    opacity: .2;
    transform: scale(.7);
  }
  30% {
    opacity: 1;
    transform: scale(1);
  }
}
@keyframes dhv-spoke {
  0% {
    opacity: 1;
  }
  to {
    opacity: .22;
  }
}
@keyframes dhv-sweep {
  0% {
    top: var(--swy0);
    opacity: 0;
  }
  12% {
    opacity: .88;
  }
  84% {
    top: var(--swy1);
    opacity: .88;
  }
  to {
    top: var(--swy1);
    opacity: 0;
  }
}
.dhv-analyzing__title {
  left: 0;
  width: 100%;
  top: calc(var(--ty) * var(--u));
  padding: 0 5%;
  font-weight: 700;
  font-size: calc(var(--tfs) * var(--u));
  line-height: 1.2;
  color: var(--dhv-color-font-title);
  text-align: center;
  white-space: nowrap;
}
.dhv-analyzing__sub {
  left: 0;
  width: 100%;
  top: calc(var(--sy) * var(--u));
  padding: 0 5%;
  font-weight: 400;
  font-size: calc(var(--sfs) * var(--u));
  line-height: 1.3;
  color: var(--dhv-color-font-contents);
  text-align: center;
  white-space: nowrap;
}
.dhv-analyzing__box {
  position: absolute;
  left: calc(var(--bx) * var(--u));
  top: calc(var(--byy) * var(--u));
  width: calc(var(--bw) * var(--u));
  height: calc(var(--bh) * var(--u));
  overflow: hidden;
}
.dhv-analyzing__sk {
  position: absolute;
  background: var(--dhv-color-border);
  animation: dhv-sk-pulse 1.4s ease-in-out infinite;
}
@keyframes dhv-sk-pulse {
  0%, to {
    opacity: 1;
  }
  50% {
    opacity: .45;
  }
}
@media (prefers-reduced-motion: reduce) {
  .dhv-analyzing__sk {
    animation: none;
  }
}
[data-dhv-layout=desktop] .dhv-analyzing__title {
  --ty: 60;
  --tfs: 45;
}
[data-dhv-layout=desktop] .dhv-analyzing__sub {
  --sy: 153;
  --sfs: 24;
}
[data-dhv-layout=desktop] .dhv-analyzing__box {
  --bx: 558;
  --byy: 206;
  --bw: 250;
  --bh: 494;
}
[data-dhv-layout=tablet-landscape] .dhv-analyzing__title {
  --ty: 60;
  --tfs: 45;
}
[data-dhv-layout=tablet-landscape] .dhv-analyzing__sub {
  --sy: 153;
  --sfs: 24;
}
[data-dhv-layout=tablet-landscape] .dhv-analyzing__box {
  --bx: 387;
  --byy: 205;
  --bw: 250;
  --bh: 494;
}
[data-dhv-layout=tablet-portrait] .dhv-analyzing__title {
  --ty: 60;
  --tfs: 45;
}
[data-dhv-layout=tablet-portrait] .dhv-analyzing__sub {
  --sy: 153;
  --sfs: 24;
}
[data-dhv-layout=tablet-portrait] .dhv-analyzing__box {
  --bx: 259;
  --byy: 206;
  --bw: 250;
  --bh: 494;
}
[data-dhv-layout=mobile] .dhv-analyzing__title {
  --ty: 60;
  --tfs: 24;
}
[data-dhv-layout=mobile] .dhv-analyzing__sub {
  --sy: 129;
  --sfs: 18;
}
[data-dhv-layout=mobile] .dhv-analyzing__box {
  --bx: 70;
  --byy: 198;
  --bw: 250;
  --bh: 494;
}
.dhv-analyzing__queue {
  left: 0;
  width: 100%;
  bottom: calc(120 * var(--u));
  text-align: center;
  font-size: calc(15 * var(--u));
  color: var(--dhv-color-font-contents);
  white-space: nowrap;
}

/* apps/web/src/reused-ux/scan.css */
.dhv-scan {
  background: #000;
  color: #fff;
}
.dhv-ux[data-dhv-layout=tablet-portrait] .dhv-scan {
  --u: min(100cqw / var(--dhv-fw), 100cqh / var(--dhv-fh));
  height: calc(var(--dhv-fh) * var(--u));
}
.dhv-ux[data-dhv-layout=mobile] .dhv-scan {
  height: 100cqh;
  --vs: 557;
  --vg: 287;
  --gu: clamp(0px, calc((100cqh - var(--vs) * var(--u)) / var(--vg)), var(--u));
}
.dhv-scan__cam {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 100cqw;
  height: 100cqh;
  background:
    radial-gradient(
      120% 90% at 50% 40%,
      #3a3f47 0%,
      #23262c 55%,
      #14161a 100%);
  overflow: hidden;
}
.dhv-scan__video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scaleX(-1);
}
.dhv-scan__guide {
  left: calc(var(--gx) * var(--u));
  top: calc(var(--gy) * var(--u));
  width: calc(var(--gw) * var(--u));
  height: calc(var(--gh) * var(--u));
  border: calc(3 * var(--u)) solid rgba(255, 255, 255, 0.9);
  border-radius: 50%;
  box-shadow: 0 0 0 100vmax rgba(0, 0, 0, 0.7);
}
.dhv-scan[data-state=error] .dhv-scan__guide {
  border-color: rgb(200, 16, 46);
}
.dhv-scan__cross {
  pointer-events: none;
  opacity: 0.85;
}
.dhv-scan__cross--h {
  left: calc(var(--chx) * var(--u));
  top: calc(var(--chy) * var(--u));
  width: calc(var(--chw) * var(--u));
  height: max(1px, calc(1.5 * var(--u)));
  background-image:
    repeating-linear-gradient(
      to right,
      rgba(255, 255, 255, 0.9) 0,
      rgba(255, 255, 255, 0.9) calc(4 * var(--u)),
      transparent calc(4 * var(--u)),
      transparent calc(8 * var(--u)));
}
.dhv-scan__cross--v {
  left: calc(var(--cvx) * var(--u));
  top: calc(var(--cvy) * var(--u));
  width: max(1px, calc(1.5 * var(--u)));
  height: calc(var(--cvh) * var(--u));
  background-image:
    repeating-linear-gradient(
      to bottom,
      rgba(255, 255, 255, 0.9) 0,
      rgba(255, 255, 255, 0.9) calc(4 * var(--u)),
      transparent calc(4 * var(--u)),
      transparent calc(8 * var(--u)));
}
.dhv-scan[data-state=complete] .dhv-scan__guide {
  border-color: rgb(40, 167, 69);
}
.dhv-scan__top {
  left: calc((var(--gx) + var(--gw) * 0.04) * var(--u));
  width: calc(var(--gw) * 0.92 * var(--u));
  top: calc(var(--topy) * var(--u));
  font-weight: 500;
  font-size: calc(var(--topfs) * var(--u));
  line-height: 1.25;
  color: #fff;
  text-align: center;
}
.dhv-scan__bottom {
  left: 0;
  width: 100%;
  top: calc(var(--boty) * var(--u));
  padding: 0 6%;
  font-weight: 400;
  font-size: calc(var(--botfs) * var(--u));
  line-height: 1.2;
  color: #fff;
  text-align: center;
}
.dhv-scan__retry {
  left: calc(var(--rx) * var(--u));
  bottom: calc(var(--rby) * var(--u));
  width: calc(var(--rw) * var(--u));
  height: calc(var(--rh) * var(--u));
  display: flex;
  align-items: center;
  justify-content: center;
  gap: calc(8 * var(--u));
  background: transparent;
  border: calc(2 * var(--u)) solid rgba(255, 255, 255, 0.9);
  border-radius: calc(10 * var(--u));
  padding: 0;
  color: #fff;
  font-family: inherit;
  font-size: calc(var(--rfs) * var(--u));
  cursor: pointer;
}
.dhv-scan__switch {
  left: calc(var(--sx) * var(--u));
  bottom: calc(var(--sby) * var(--u));
  width: calc(var(--sw) * var(--u));
  height: calc(var(--sw) * var(--u));
  border: none;
  background: none;
  cursor: pointer;
  padding: 0;
}
.dhv-scan__switch img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}
.dhv-scan__help {
  left: calc(var(--hx) * var(--u));
  top: calc(var(--hy) * var(--u));
  width: calc(120 * var(--u));
  height: calc(44 * var(--u));
  background: transparent;
  border: calc(1.5 * var(--u)) solid rgba(255, 255, 255, 0.9);
  border-radius: calc(10 * var(--u));
  color: #fff;
  font-family: inherit;
  font-size: calc(16 * var(--u));
  cursor: pointer;
}
.dhv-scan__start {
  left: calc(var(--stx) * var(--u));
  bottom: calc(var(--stby) * var(--u));
  width: calc(var(--stw) * var(--u));
  height: calc(var(--sth) * var(--u));
  border: none;
  border-radius: calc(10 * var(--u));
  background: var(--dhv-color-primary-cta);
  color: #fff;
  font-family: inherit;
  font-weight: 600;
  font-size: calc(var(--stfs) * var(--u));
  display: flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
  cursor: pointer;
}
[data-dhv-layout=desktop] .dhv-scan {
  --gx: 508;
  --gy: 100;
  --gw: 350;
  --gh: 456;
}
[data-dhv-layout=desktop] .dhv-scan__cross--h {
  --chx: 531;
  --chy: 330;
  --chw: 304;
}
[data-dhv-layout=desktop] .dhv-scan__cross--v {
  --cvx: 683;
  --cvy: 124;
  --cvh: 412;
}
[data-dhv-layout=desktop] .dhv-scan__top {
  --topy: 336;
  --topfs: 40;
}
[data-dhv-layout=desktop] .dhv-scan[data-state=scanning] .dhv-scan__top,
[data-dhv-layout=desktop] .dhv-scan[data-state=error] .dhv-scan__top,
[data-dhv-layout=desktop] .dhv-scan[data-state=complete] .dhv-scan__top {
  --topy: 340;
  --topfs: 24;
}
[data-dhv-layout=desktop] .dhv-scan__bottom {
  --boty: 612;
  --botfs: 32;
}
[data-dhv-layout=desktop] .dhv-scan__retry {
  --rx: 144;
  --rby: 105;
  --rfs: 24;
  --rw: 150;
  --rh: 65;
}
[data-dhv-layout=desktop] .dhv-scan__switch {
  --sx: 1156;
  --sby: 104;
  --sw: 66;
}
[data-dhv-layout=desktop] .dhv-scan__help {
  --hx: 1166;
  --hy: 80;
}
[data-dhv-layout=desktop] .dhv-scan__start {
  --stx: 453;
  --stby: 94;
  --stw: 460;
  --sth: 82;
  --stfs: 34;
}
[data-dhv-layout=tablet-landscape] .dhv-scan {
  --gx: 310;
  --gy: 72;
  --gw: 404;
  --gh: 526;
}
[data-dhv-layout=tablet-landscape] .dhv-scan__cross--h {
  --chx: 342;
  --chy: 335;
  --chw: 340;
}
[data-dhv-layout=tablet-landscape] .dhv-scan__cross--v {
  --cvx: 512;
  --cvy: 105;
  --cvh: 460;
}
[data-dhv-layout=tablet-landscape] .dhv-scan__top {
  --topy: 345;
  --topfs: 45;
}
[data-dhv-layout=tablet-landscape] .dhv-scan[data-state=scanning] .dhv-scan__top,
[data-dhv-layout=tablet-landscape] .dhv-scan[data-state=error] .dhv-scan__top,
[data-dhv-layout=tablet-landscape] .dhv-scan[data-state=complete] .dhv-scan__top {
  --topy: 345;
  --topfs: 24;
}
[data-dhv-layout=tablet-landscape] .dhv-scan__bottom {
  --boty: 613;
  --botfs: 32;
}
[data-dhv-layout=tablet-landscape] .dhv-scan__retry {
  --rx: 48;
  --rby: 41;
  --rfs: 24;
  --rw: 150;
  --rh: 65;
}
[data-dhv-layout=tablet-landscape] .dhv-scan__switch {
  --sx: 910;
  --sby: 40;
  --sw: 66;
}
[data-dhv-layout=tablet-landscape] .dhv-scan__help {
  --hx: 856;
  --hy: 33;
}
[data-dhv-layout=tablet-landscape] .dhv-scan__start {
  --stx: 282;
  --stby: 56;
  --stw: 460;
  --sth: 82;
  --stfs: 34;
}
[data-dhv-layout=tablet-portrait] .dhv-scan {
  --gx: 154;
  --gy: 80;
  --gw: 460;
  --gh: 598;
}
[data-dhv-layout=tablet-portrait] .dhv-scan__cross--h {
  --chx: 214;
  --chy: 379;
  --chw: 340;
}
[data-dhv-layout=tablet-portrait] .dhv-scan__cross--v {
  --cvx: 384;
  --cvy: 149;
  --cvh: 460;
}
[data-dhv-layout=tablet-portrait] .dhv-scan__top {
  --topy: 389;
  --topfs: 45;
}
[data-dhv-layout=tablet-portrait] .dhv-scan[data-state=scanning] .dhv-scan__top,
[data-dhv-layout=tablet-portrait] .dhv-scan[data-state=error] .dhv-scan__top,
[data-dhv-layout=tablet-portrait] .dhv-scan[data-state=complete] .dhv-scan__top {
  --topy: 389;
  --topfs: 24;
}
[data-dhv-layout=tablet-portrait] .dhv-scan__bottom {
  --boty: 706;
  --botfs: 32;
}
[data-dhv-layout=tablet-portrait] .dhv-scan__retry {
  --rx: 24;
  --rby: 73;
  --rfs: 24;
  --rw: 150;
  --rh: 65;
}
[data-dhv-layout=tablet-portrait] .dhv-scan__switch {
  --sx: 678;
  --sby: 72;
  --sw: 66;
}
[data-dhv-layout=tablet-portrait] .dhv-scan__help {
  --hx: 624;
  --hy: 33;
}
[data-dhv-layout=tablet-portrait] .dhv-scan__start {
  --stx: 154;
  --stby: 196;
  --stw: 460;
  --sth: 82;
  --stfs: 34;
}
[data-dhv-layout=mobile] .dhv-scan {
  --gx: 37;
  --gy: 130;
  --gw: 321;
  --gh: 418;
}
[data-dhv-layout=mobile] .dhv-scan__cross--h {
  --chx: 56;
  --chy: 339;
  --chw: 280;
}
[data-dhv-layout=mobile] .dhv-scan__cross--v {
  --cvx: 196;
  --cvy: 150;
  --cvh: 378;
}
[data-dhv-layout=mobile] .dhv-scan__top {
  --topy: 348;
  --topfs: 36;
}
[data-dhv-layout=mobile] .dhv-scan[data-state=scanning] .dhv-scan__top,
[data-dhv-layout=mobile] .dhv-scan[data-state=error] .dhv-scan__top,
[data-dhv-layout=mobile] .dhv-scan[data-state=complete] .dhv-scan__top {
  --topy: 348;
  --topfs: 21;
}
[data-dhv-layout=mobile] .dhv-scan__bottom {
  --boty: 572;
  --botfs: 28;
}
[data-dhv-layout=mobile] .dhv-scan__retry {
  --rx: 33;
  --rby: 70;
  --rfs: 16;
  --rw: 100;
  --rh: 40;
}
[data-dhv-layout=mobile] .dhv-scan__switch {
  --sx: 314;
  --sby: 69;
  --sw: 43;
}
[data-dhv-layout=mobile] .dhv-scan__help {
  --hx: 253;
  --hy: 47;
}
[data-dhv-layout=mobile] .dhv-scan__start {
  --stx: 33;
  --stby: 136;
  --stw: 324;
  --sth: 52;
  --stfs: 21;
}
.dhv-ux[data-dhv-layout=mobile] .dhv-scan .dhv-scan__help {
  top: calc(47 * var(--gu));
}
.dhv-ux[data-dhv-layout=mobile] .dhv-scan .dhv-scan__guide {
  top: calc(44 * var(--u) + 86 * var(--gu));
}
.dhv-ux[data-dhv-layout=mobile] .dhv-scan .dhv-scan__cross--v {
  top: calc(64 * var(--u) + 86 * var(--gu));
}
.dhv-ux[data-dhv-layout=mobile] .dhv-scan .dhv-scan__cross--h {
  top: calc(253 * var(--u) + 86 * var(--gu));
}
.dhv-ux[data-dhv-layout=mobile] .dhv-scan .dhv-scan__top {
  top: calc(262 * var(--u) + 86 * var(--gu));
}
.dhv-ux[data-dhv-layout=mobile] .dhv-scan .dhv-scan__bottom {
  top: calc(462 * var(--u) + 110 * var(--gu));
}
.dhv-ux[data-dhv-layout=mobile] .dhv-scan .dhv-scan__start {
  bottom: calc(43 * var(--u) + 93 * var(--gu));
}
.dhv-ux[data-dhv-layout=mobile] .dhv-scan .dhv-scan__retry {
  bottom: calc(70 * var(--gu));
}
.dhv-ux[data-dhv-layout=mobile] .dhv-scan .dhv-scan__switch {
  bottom: calc(69 * var(--gu));
}
.dhv-scan__facedebug {
  left: calc(8 * var(--u));
  top: calc(8 * var(--u));
  max-width: 70%;
  background: rgba(0, 0, 0, 0.72);
  color: #fff;
  border-radius: calc(6 * var(--u));
  padding: calc(6 * var(--u)) calc(9 * var(--u));
  font-size: calc(12 * var(--u));
  line-height: 1.45;
  font-family:
    ui-monospace,
    SFMono-Regular,
    Menlo,
    monospace;
  white-space: pre-line;
  white-space: normal;
  pointer-events: none;
  z-index: 9;
}
.dhv-scan__notice {
  left: calc(16 * var(--u));
  right: calc(16 * var(--u));
  width: fit-content;
  margin-inline: auto;
  top: calc(12 * var(--u));
  background: rgba(20, 22, 26, 0.92);
  color: #fff;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: calc(12 * var(--u));
  padding: calc(12 * var(--u)) calc(16 * var(--u));
  font-size: calc(14 * var(--u));
  line-height: 1.45;
  text-align: center;
  white-space: pre-line;
  z-index: 6;
  transition: opacity 0.5s;
}
.dhv-scan__notice.is-out {
  opacity: 0;
}
.dhv-scan__stop {
  position: fixed;
  inset: 0;
  z-index: 7;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: calc(28 * var(--u));
  padding: 8%;
  background: rgba(10, 12, 15, 0.88);
}
.dhv-scan__stop-msg {
  margin: 0;
  color: #fff;
  text-align: center;
  font-size: calc(20 * var(--u));
  line-height: 1.5;
  white-space: pre-line;
}
.dhv-scan__stop-retry {
  flex: none;
  align-self: center;
  width: fit-content;
  display: flex;
  align-items: center;
  gap: calc(8 * var(--u));
  height: calc(56 * var(--u));
  padding: 0 calc(28 * var(--u));
  background: var(--dhv-color-primary-cta);
  color: #fff;
  border: none;
  border-radius: calc(10 * var(--u));
  font-family: inherit;
  font-weight: 600;
  font-size: calc(18 * var(--u));
  cursor: pointer;
}
.dhv-scan__dotring {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: none;
  overflow: visible;
}
.dhv-scan[data-state=scanning] .dhv-scan__dotring {
  display: block;
}
.dhv-scan__dotring rect {
  transition: stroke-dashoffset 0.2s linear;
}
.dhv-scan__perm {
  position: fixed;
  inset: 0;
  z-index: 8;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(10, 12, 15, 0.7);
}
.dhv-scan__perm-box {
  width: min(86%, calc(420 * var(--u)));
  background: var(--dhv-color-surface);
  border-radius: calc(14 * var(--u));
  padding: calc(28 * var(--u)) calc(24 * var(--u));
  display: flex;
  flex-direction: column;
  gap: calc(12 * var(--u));
  text-align: center;
}
.dhv-scan__perm-title {
  margin: 0;
  font-weight: 700;
  font-size: calc(20 * var(--u));
  color: var(--dhv-color-font-title);
}
.dhv-scan__perm-desc {
  margin: 0 0 calc(8 * var(--u));
  font-size: calc(15 * var(--u));
  color: var(--dhv-color-font-contents);
}
.dhv-scan__perm-retry {
  height: calc(48 * var(--u));
  border: none;
  border-radius: calc(10 * var(--u));
  background: var(--dhv-color-primary-cta);
  color: var(--dhv-color-primary-btn-text);
  font-family: inherit;
  font-weight: 600;
  font-size: calc(16 * var(--u));
  cursor: pointer;
}
.dhv-scan__perm-box--single {
  width: min(78%, calc(360 * var(--u)));
}
.dhv-scan__perm-close {
  height: calc(48 * var(--u));
  border-radius: calc(10 * var(--u));
  background: var(--dhv-color-secondary-cta-bg);
  color: var(--dhv-color-secondary-btn-text);
  border: calc(1.5 * var(--u)) solid var(--dhv-color-secondary-cta-border);
  font-family: inherit;
  font-weight: 600;
  font-size: calc(16 * var(--u));
  cursor: pointer;
}
.dhv-scan__perm--camera {
  --pk: 1;
  --pneed: 722;
  --pu: min(calc(var(--u) * var(--pk)), max(min(calc(var(--u) * var(--pk)), 1px), calc(100cqh / var(--pneed))));
  background: rgba(0, 0, 0, 0.95);
}
.dhv-scan__perm--camera[data-platform=android],
.dhv-scan__perm--camera[data-platform=ios] {
  --pneed: 477;
}
.dhv-scan__perm--camera[data-platform=pc] {
  --pneed: 512;
}
.dhv-ux[data-dhv-layout=tablet-portrait] .dhv-scan__perm--camera,
.dhv-ux[data-dhv-layout=tablet-landscape] .dhv-scan__perm--camera,
.dhv-ux[data-dhv-layout=desktop] .dhv-scan__perm--camera {
  --pk: 1.4;
}
.dhv-scan__perm-box--camera {
  background: #FFFFFF;
  width: calc(334 * var(--pu));
  max-height: calc(100cqh - 56 * var(--pu));
  overflow-y: auto;
  gap: 0;
  padding: calc(44 * var(--pu)) calc(23 * var(--pu)) calc(33 * var(--pu));
  border: calc(1 * var(--pu)) solid rgba(112, 112, 112, 1);
  border-radius: calc(15 * var(--pu));
}
.dhv-scan__perm-box--camera > * {
  flex-shrink: 0;
}
.dhv-scan__perm-box--camera .dhv-scan__perm-title {
  font-size: calc(21 * var(--pu));
  line-height: calc(25 * var(--pu));
  letter-spacing: -0.02em;
  color: #000000;
}
.dhv-scan__perm-box--camera .dhv-scan__perm-desc {
  margin: calc(16.5 * var(--pu)) 0 0;
  white-space: break-spaces;
  font-size: calc(16 * var(--pu));
  line-height: calc(24 * var(--pu));
  letter-spacing: -0.02em;
  color: #212529;
}
.dhv-scan__perm-steps {
  margin-top: calc(32 * var(--pu));
}
.dhv-scan__perm-steps ~ .dhv-scan__perm-steps {
  margin-top: calc(30 * var(--pu));
}
.dhv-scan__perm-plat {
  margin: 0;
  font-weight: 700;
  font-size: calc(16 * var(--pu));
  line-height: calc(26 * var(--pu));
  letter-spacing: -0.02em;
  color: #000000;
}
.dhv-scan__perm-how {
  margin: calc(4 * var(--pu)) 0 0;
  white-space: break-spaces;
  font-weight: 400;
  font-size: calc(16 * var(--pu));
  line-height: calc(24 * var(--pu));
  letter-spacing: -0.02em;
  color: #212529;
}
.dhv-scan__perm-how strong {
  font-weight: 700;
}
.dhv-scan__perm-box--camera .dhv-scan__perm-close {
  margin-top: calc(37.5 * var(--pu));
  height: calc(50 * var(--pu));
  border-radius: calc(10 * var(--pu));
  font-weight: 500;
  font-size: calc(18 * var(--pu));
  background: #FFFFFF;
  color: #284A84;
  border: calc(1.5 * var(--pu)) solid #C9D3E3;
}
.dhv-scan__perm-box--camera .dhv-scan__perm-retry {
  margin-top: calc(10 * var(--pu));
  height: calc(50 * var(--pu));
  border-radius: calc(10 * var(--pu));
  font-weight: 500;
  font-size: calc(18 * var(--pu));
  background: #3D6FF2;
  color: #FFFFFF;
  box-shadow: 0 calc(2 * var(--pu)) calc(4 * var(--pu)) rgba(0, 0, 0, 0.161);
}
.dhv-scan__perm--camera[data-platform=android] .dhv-scan__perm-close,
.dhv-scan__perm--camera[data-platform=ios] .dhv-scan__perm-close {
  margin-top: calc(32.5 * var(--pu));
}
.dhv-scan__perm--camera[data-platform=pc] .dhv-scan__perm-close {
  margin-top: calc(34.5 * var(--pu));
}
.dhv-scan__perm--camera[data-platform=pc] .dhv-scan__perm-retry {
  margin-top: calc(19 * var(--pu));
}
.dhv-scan__start:disabled {
  opacity: 0.45;
  cursor: default;
}
.dhv-scan__bottom {
  white-space: pre-line;
}
.dhv-scan__dotfield {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  display: none;
}
.dhv-scan[data-state=scanning] .dhv-scan__dotfield {
  display: block;
}
.dhv-scan__init {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  font-size: calc(14 * var(--u));
  color: rgba(255, 255, 255, 0.9);
  text-shadow: 0 calc(7 * var(--u)) calc(20 * var(--u)) rgba(0, 0, 0, 0.45);
  display: none;
  pointer-events: none;
}
.dhv-scan[data-state=start][data-phase=init] .dhv-scan__init {
  display: block;
}
.dhv-scan[data-state=start][data-phase=init] :is(.dhv-scan__guide, .dhv-scan__cross, .dhv-scan__start, .dhv-scan__retry, .dhv-scan__switch) {
  display: none;
}
.dhv-scan[data-state=start][data-phase=preview] .dhv-scan__start {
  display: none;
}
.dhv-scan[data-state=start]:is([data-phase=preview], [data-phase=hint]) :is(.dhv-scan__retry, .dhv-scan__switch) {
  opacity: 0.45;
  pointer-events: none;
}
.dhv-scan__hintbox {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 100cqw;
  height: 100cqh;
  overflow: hidden;
  pointer-events: none;
}
.dhv-scan__hint {
  position: absolute;
  display: none;
  pointer-events: none;
  opacity: 0;
  transform: scale(0.97);
  transform-origin: 50% 30%;
  transition: opacity 0.75s ease, transform 0.75s ease;
}
.dhv-scan[data-state=start]:is([data-phase=hint], [data-phase=ready]) .dhv-scan__hint.is-fading,
.dhv-scan[data-state=start][data-phase=hint] .dhv-scan__hint {
  display: block;
}
.dhv-scan[data-state=start][data-phase=hint] .dhv-scan__hint {
  opacity: 0.74;
  transform: scale(1);
  transition: opacity 0.55s ease-out, transform 0.55s ease-out;
}
.dhv-scan__sweep {
  position: absolute;
  display: none;
  pointer-events: none;
  height: max(1px, calc(2 * var(--u)));
  opacity: 0;
  top: var(--swy0);
  background-image:
    linear-gradient(
      90deg,
      transparent,
      rgba(127, 178, 255, 0.9),
      rgba(68, 208, 123, 0.9),
      transparent);
}
.dhv-scan[data-state=start][data-phase=hint] .dhv-scan__sweep {
  display: block;
}
.dhv-scan__sweep.is-run {
  animation: dhv-sweep 2.45s ease-in-out;
}
@keyframes dhv-sweep {
  0% {
    top: var(--swy0);
    opacity: 0;
  }
  12% {
    opacity: 0.88;
  }
  84% {
    top: var(--swy1);
    opacity: 0.88;
  }
  100% {
    top: var(--swy1);
    opacity: 0;
  }
}
@media (prefers-reduced-motion: reduce) {
  .dhv-scan__hint {
    transition: none;
  }
  .dhv-scan__sweep.is-run {
    animation: none;
  }
}
.dhv-scan[data-state=scanning][data-stopped=true] .dhv-scan__retry {
  display: flex;
}
.dhv-scan[data-state=scanning][data-face=off] .dhv-scan__guide {
  border-color: rgb(200, 16, 46);
}
.dhv-scan[data-state=scanning][data-face=off] .dhv-scan__dotring rect {
  stroke: rgb(200, 16, 46);
}
.dhv-scan[data-crossline=border] .dhv-scan__cross--h {
  height: 0;
  background-image: none;
  border-top: calc(1.5 * var(--u)) dashed rgba(255, 255, 255, 0.9);
}
.dhv-scan[data-crossline=border] .dhv-scan__cross--v {
  width: 0;
  background-image: none;
  border-left: calc(1.5 * var(--u)) dashed rgba(255, 255, 255, 0.9);
}
.dhv-scan__reminder {
  position: absolute;
  inset: 0;
  z-index: 7;
  background: rgba(0, 0, 0, 0.7);
}
.dhv-scan__reminder-title {
  position: absolute;
  left: 0;
  width: 100%;
  top: calc(var(--rt) * var(--u));
  margin: 0;
  padding: 0 5%;
  text-align: center;
  color: #fff;
  font-weight: 700;
  font-size: calc(var(--rtfs) * var(--u));
  line-height: 1.2;
}
.dhv-scan__reminder-body {
  position: absolute;
  left: 0;
  width: 100%;
  top: calc(var(--rb) * var(--u));
  margin: 0;
  padding: 0 5%;
  text-align: center;
  color: #fff;
  white-space: pre-line;
  font-weight: 400;
  font-size: calc(var(--rbfs) * var(--u));
  line-height: 1.4;
}
.dhv-scan__reminder-cta {
  position: absolute;
  left: calc(var(--rcx) * var(--u));
  bottom: calc(var(--rcby) * var(--u));
  width: calc(var(--rcw) * var(--u));
  height: calc(var(--rch) * var(--u));
  border: none;
  border-radius: calc(10 * var(--u));
  background: rgb(61, 111, 242);
  color: #fff;
  font-family: inherit;
  font-weight: var(--rcfw);
  font-size: calc(var(--rcfs) * var(--u));
  display: flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
  cursor: pointer;
}
[data-dhv-layout=desktop] .dhv-scan__reminder {
  --rt: 160;
  --rtfs: 32;
  --rb: 213;
  --rbfs: 24;
  --rcx: 453;
  --rcby: 94;
  --rcw: 460;
  --rch: 82;
  --rcfs: 34;
  --rcfw: 600;
}
[data-dhv-layout=tablet-landscape] .dhv-scan__reminder {
  --rt: 140;
  --rtfs: 32;
  --rb: 193;
  --rbfs: 24;
  --rcx: 282;
  --rcby: 56;
  --rcw: 460;
  --rch: 82;
  --rcfs: 34;
  --rcfw: 600;
}
[data-dhv-layout=tablet-portrait] .dhv-scan__reminder {
  --rt: 140;
  --rtfs: 32;
  --rb: 193;
  --rbfs: 24;
  --rcx: 154;
  --rcby: 88;
  --rcw: 460;
  --rch: 82;
  --rcfs: 34;
  --rcfw: 600;
}
[data-dhv-layout=mobile] .dhv-scan__reminder {
  --rt: 150;
  --rtfs: 24;
  --rb: 195;
  --rbfs: 16;
  --rcx: 33;
  --rcby: 64;
  --rcw: 324;
  --rch: 52;
  --rcfs: 21;
  --rcfw: 500;
}
.dhv-scan[data-reminder=true] :is(.dhv-scan__start, .dhv-scan__help, .dhv-scan__retry, .dhv-scan__switch, .dhv-scan__top, .dhv-scan__bottom, .dhv-scan__dotring) {
  display: none;
}
.dhv-scan[data-reminder=true] .dhv-scan__hint {
  display: block;
  opacity: 1;
  filter: none;
  transform: none;
  transition: none;
}

/* apps/web/src/reused-ux/help.css */
.dhv-help {
  position: absolute;
  inset: 0;
  overflow: auto;
  background: var(--dhv-color-bg);
  color: var(--dhv-color-font-contents);
  padding: 48px 14px 28px;
}
[data-dhv-layout=tablet-landscape] .dhv-help,
[data-dhv-layout=tablet-portrait] .dhv-help {
  padding-top: 48px;
}
[data-dhv-layout=mobile] .dhv-help {
  padding-top: 48px;
}
.dhv-help__col {
  max-width: 460px;
  margin: 0 auto;
}
.dhv-help__head {
  position: relative;
  margin: 12px 6px 20px;
}
.dhv-help__title {
  font-size: 34px;
  font-weight: 700;
  color: var(--dhv-color-font-title);
  text-align: center;
}
[data-dhv-layout=mobile] .dhv-help__title {
  font-size: 24px;
}
.dhv-help__close {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 48px;
  height: 48px;
  padding: 0;
  cursor: pointer;
  border: none;
  background: none;
  right: calc(-1 * var(--dhv-close-out, 0px));
}
[data-dhv-layout=desktop] .dhv-help__close {
  --dhv-close-out: 170px;
}
[data-dhv-layout=tablet-landscape] .dhv-help__close {
  --dhv-close-out: 108px;
}
[data-dhv-layout=tablet-portrait] .dhv-help__close {
  --dhv-close-out: 82px;
}
[data-dhv-layout=mobile] .dhv-help__close {
  width: 44px;
  height: 44px;
  --dhv-close-out: 0px;
  right: -2px;
}
.dhv-help__close:focus-visible {
  outline: 2px solid var(--dhv-color-focused);
  outline-offset: 2px;
}
.dhv-help__section {
  font-size: 24px;
  font-weight: 800;
  color: var(--dhv-color-font-title);
  margin: 44px 10px 16px;
  display: flex;
  align-items: center;
  gap: 6px;
}
.dhv-help__section-icon {
  line-height: 1;
  flex: none;
}
.dhv-help__card {
  background: var(--dhv-color-surface);
  border-radius: 10px;
  padding: 18px 20px;
  margin-bottom: 8px;
}
.dhv-help__subhead {
  font-size: 21px;
  font-weight: 800;
  color: var(--dhv-color-font-title);
  margin: 48px 0 16px;
}
.dhv-help__card > .dhv-help__subhead:first-child {
  margin-top: 0;
}
.dhv-help__list {
  list-style: none;
  margin: 0 0 12px;
  padding: 0;
}
.dhv-help__list li {
  font-size: 18px;
  line-height: 1.6;
  color: var(--dhv-color-font-contents);
}
.dhv-help__text {
  font-size: 18px;
  line-height: 1.5;
  margin: 4px 0;
  color: var(--dhv-color-font-contents);
}
.dhv-help__mail {
  font-size: 18px;
  color: var(--dhv-color-primary-cta);
  text-decoration: underline;
}
.dhv-help__photos {
  margin-top: 14px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  max-width: 360px;
}
.dhv-help__photos img {
  width: 100%;
  height: auto;
  border-radius: 8px;
  display: block;
}
.dhv-help__list--check li {
  display: flex;
  align-items: center;
  gap: 8px;
}
.dhv-help__check {
  width: 18px;
  height: 18px;
  flex: none;
  display: inline-block;
}
[data-dhv-layout=mobile] .dhv-help__check {
  width: 16px;
  height: 16px;
}
.dhv-help__issue-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.dhv-help__issue-head {
  margin-bottom: 0;
}
.dhv-help__issue-card > .dhv-help__list {
  margin-top: 24px;
}
.dhv-help__card .dhv-help__issue-head .dhv-help__subhead {
  margin: 0;
}
.dhv-help__issue-card {
  padding-top: 15px;
  padding-bottom: 15px;
}
.dhv-help__issue-chev {
  width: 30px;
  height: 22px;
  padding: 4px 6px;
  border: none;
  background: none;
  cursor: pointer;
  color: var(--dhv-color-font-title);
  flex: none;
  display: block;
}
.dhv-help__issue-chev:focus-visible {
  outline: 2px solid var(--dhv-color-focused);
  outline-offset: 2px;
  border-radius: 4px;
}
.dhv-help__powered {
  text-align: center;
  font-size: 14px;
  font-weight: 300;
  color: #666666;
  margin-top: 22px;
}
.dhv-help__var--m {
  display: none;
}
[data-dhv-layout=mobile] .dhv-help .dhv-help__var--f {
  display: none;
}
[data-dhv-layout=mobile] .dhv-help .dhv-help__var--m {
  display: inline;
}
.dhv-help__close img,
.dhv-help__issue-chev img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}
.dhv-ux[data-dhv-theme=dark] .dhv-help__issue-chev img,
.dhv-ux[data-dhv-theme=dark] .dhv-help__close img {
  filter: brightness(0) invert(1);
}
[data-dhv-layout=mobile] .dhv-help__section {
  font-size: 18px;
}
[data-dhv-layout=mobile] .dhv-help__subhead {
  font-size: 16px;
  margin: 24px 0 8px;
}
[data-dhv-layout=mobile] .dhv-help__issue-card > .dhv-help__list {
  margin-top: 12px;
}
[data-dhv-layout=mobile] .dhv-help__list li {
  font-size: 16px;
}
[data-dhv-layout=mobile] .dhv-help__text,
[data-dhv-layout=mobile] .dhv-help__mail {
  font-size: 16px;
}

/* apps/web/src/reused-ux/tokens.css */
.dhv-ux {
  --dhv-font-primary:
    "Pretendard",
    "Open Sans",
    system-ui,
    -apple-system,
    sans-serif;
  --dhv-color-bg: #F5F6F8;
  --dhv-color-surface: #FFFFFF;
  --dhv-color-border: #E5E7EB;
  --dhv-color-divider: #ECECEC;
  --dhv-color-selected-bg: #F3F7FF;
  --dhv-color-primary-cta: #3D6FF2;
  --dhv-color-focused: #0357FF;
  --dhv-color-secondary-cta-bg: #FFFFFF;
  --dhv-color-secondary-cta-border: #C9D3E3;
  --dhv-color-disabled: #B8C2D9;
  --dhv-color-primary-btn-text: #FFFFFF;
  --dhv-color-secondary-btn-text: #284A84;
  --dhv-color-font-title: #000000;
  --dhv-color-font-contents: #464646;
  --dhv-color-input-focused: #3D6FF2;
  --dhv-color-error: #E23B3B;
  --dhv-shadow-input-focused: 0 0 14px rgba(63, 108, 255, 0.24);
  --dhv-fs-title: 45px;
  --dhv-fs-button: 34px;
  --dhv-fs-heading: 28px;
  --dhv-fs-body: 24px;
  --dhv-fs-caption: 16px;
  --dhv-fs-small: 14px;
  --dhv-max-width: 1024px;
  color-scheme: light;
  font-family: var(--dhv-font-primary);
  color: var(--dhv-color-font-contents);
  -webkit-font-smoothing: antialiased;
  overscroll-behavior: none;
}
.dhv-ux[data-dhv-theme=dark] {
  --dhv-color-bg: #0E1116;
  --dhv-color-surface: #1A1E26;
  --dhv-color-border: #2C323D;
  --dhv-color-divider: #262B34;
  --dhv-color-selected-bg: #17233B;
  --dhv-color-primary-cta: #4B79FF;
  --dhv-color-focused: #5A8CFF;
  --dhv-color-secondary-cta-bg: #1A1E26;
  --dhv-color-secondary-cta-border: #39414F;
  --dhv-color-disabled: #363D49;
  --dhv-color-primary-btn-text: #FFFFFF;
  --dhv-color-secondary-btn-text: #A9C3F7;
  --dhv-color-font-title: #F3F5F9;
  --dhv-color-font-contents: #AEB4C0;
  --dhv-color-input-focused: #4B79FF;
  --dhv-color-error: #FF6B6B;
  --dhv-shadow-input-focused: 0 0 14px rgba(90, 140, 255, 0.35);
  color-scheme: dark;
}
.dhv-ux[data-dhv-layout=mobile] {
  --dhv-fs-title: 24px;
  --dhv-fs-button: 21px;
  --dhv-fs-heading: 18px;
  --dhv-fs-body: 16px;
  --dhv-fs-caption: 15px;
  --dhv-fs-small: 14px;
}
.dhv-ux[data-dhv-layout=desktop] {
  --dhv-max-width: 1200px;
}
.dhv-ux,
.dhv-ux *,
.dhv-ux *::before,
.dhv-ux *::after {
  box-sizing: border-box;
}
.dhv-ux :where(p, h1, h2, h3, h4, button, input) {
  margin: 0;
}
.dhv-ux__screen {
  position: absolute;
  inset: 0;
  overflow: auto;
  overscroll-behavior: none;
  container-type: size;
  display: grid;
  place-items: safe center;
}
.dhv-ux {
  --dhv-fw: 390;
  --dhv-fh: 844;
}
.dhv-ux[data-dhv-layout=mobile] {
  --dhv-fw: 390;
  --dhv-fh: 844;
}
.dhv-ux[data-dhv-layout=tablet-portrait] {
  --dhv-fw: 768;
  --dhv-fh: 1024;
}
.dhv-ux[data-dhv-layout=tablet-landscape] {
  --dhv-fw: 1024;
  --dhv-fh: 768;
}
.dhv-ux[data-dhv-layout=desktop] {
  --dhv-fw: 1366;
  --dhv-fh: 768;
}
.dhv-stage {
  --u: min(100cqw / var(--dhv-fw), 100cqh / var(--dhv-fh));
  position: relative;
  width: calc(var(--dhv-fw) * var(--u));
  height: calc(var(--dhv-fh) * var(--u));
  background: var(--dhv-color-bg);
}
.dhv-stage--scroll {
  --u: calc(100cqw / var(--dhv-fw));
  height: calc(var(--dhv-fh) * var(--u));
}
.dhv-ux[data-dhv-layout=mobile] .dhv-stage,
.dhv-ux[data-dhv-layout=tablet-portrait] .dhv-stage {
  --u: calc(100cqw / var(--dhv-fw));
}
@container (min-aspect-ratio: 17 / 20) {
  .dhv-ux[data-dhv-layout=tablet-portrait] .dhv-stage:not(.dhv-stage--scroll) {
    --u: min(100cqw / var(--dhv-fw), 100cqh / var(--dhv-fh));
  }
}
.dhv-ux[data-dhv-layout=mobile] .dhv-stage--fill,
.dhv-ux[data-dhv-layout=tablet-portrait] .dhv-stage--fill {
  height: 100cqh;
}
.dhv-stage > * {
  position: absolute;
  box-sizing: border-box;
}
.dhv-rotate-guard {
  position: absolute;
  inset: 0;
  z-index: 10;
  display: none;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: clamp(16px, 5vh, 32px);
  padding: 8%;
  text-align: center;
  background: var(--dhv-color-bg);
}
.dhv-fold-guard {
  position: absolute;
  inset: 0;
  z-index: 10;
  display: none;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 6% 6% calc(6% + 16.8vh);
  text-align: center;
  background: #f5f6f8;
}
.dhv-ux[data-dhv-fold=cover] .dhv-fold-guard {
  display: flex;
}
.dhv-fold-guard__icon {
  width: clamp(120px, 32vh, 180px);
  height: auto;
}
.dhv-fold-guard__title {
  margin-top: clamp(12px, 4.3vh, 24px);
  font-weight: 700;
  font-size: clamp(19px, 5.2vh, 24px);
  line-height: calc(29 / 24);
  color: #000;
}
.dhv-ux[data-dhv-rotate=phone-landscape] .dhv-rotate-guard {
  display: flex;
}
.dhv-rotate-guard__icon {
  width: clamp(48px, 16vh, 88px);
  height: auto;
  color: var(--dhv-color-primary-cta);
}
.dhv-rotate-guard__text {
  font-weight: 500;
  font-size: clamp(15px, 4.5vh, 20px);
  line-height: 1.4;
  color: var(--dhv-color-font-title);
}
.dhv-fold-guard__text {
  margin-top: clamp(8px, 2.9vh, 16px);
  font-weight: 400;
  font-size: clamp(14px, 3.9vh, 18px);
  line-height: calc(26 / 18);
  color: #000;
  white-space: pre-line;
}
.dhv-fold-guard__text b {
  font-weight: 700;
}

/* apps/web/src/reused-ux/result.css */
.dhv-result {
  position: absolute;
  inset: 0;
  overflow: auto;
  background: var(--dhv-color-bg);
  color: var(--dhv-color-font-contents);
  padding: 76px 14px 28px;
}
[data-dhv-layout=tablet-landscape] .dhv-result,
[data-dhv-layout=tablet-portrait] .dhv-result {
  padding-top: 56px;
}
[data-dhv-layout=mobile] .dhv-result {
  padding-top: 66px;
}
.dhv-result__col {
  max-width: 864px;
  margin: 0 auto;
}
[data-dhv-layout=tablet-portrait] .dhv-result__col {
  max-width: 666px;
}
.dhv-result__doc {
  display: block;
  width: 60px;
  height: 60px;
  margin: 0 auto 24px;
}
.dhv-result__title {
  font-size: 32px;
  font-weight: 700;
  color: var(--dhv-color-font-title);
  margin: 0 6px 4px;
  text-align: center;
}
[data-dhv-layout=mobile] .dhv-result__title {
  font-size: 24px;
}
.dhv-result__disclaimer {
  font-size: 20px;
  font-weight: 400;
  color: var(--dhv-color-font-contents);
  margin: 8px 6px 8px;
  text-align: center;
  white-space: pre-line;
}
.dhv-result__section {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 24px;
  font-weight: 800;
  color: var(--dhv-color-font-title);
  margin: 44px 6px 10px;
}
.dhv-result__section-arrows {
  display: flex;
  gap: 10px;
}
.dhv-result__section-arrow {
  width: 20px;
  height: 12px;
  padding: 0;
  border: none;
  background: none;
  cursor: pointer;
  display: block;
}
.dhv-result__section-arrow img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}
.dhv-result__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.dhv-result__grid .dhv-result__card {
  margin-bottom: 0;
}
[data-dhv-layout=mobile] .dhv-result__grid {
  grid-template-columns: 1fr;
}
.dhv-result__card {
  background: var(--dhv-color-surface);
  border-radius: 10px;
  padding: 22px 20px 18px;
  margin-bottom: 12px;
}
.dhv-result__card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 16px;
}
.dhv-result__card-name {
  font-size: 21px;
  font-weight: 700;
  color: var(--dhv-color-font-title);
  display: flex;
  align-items: center;
  gap: 4px;
}
.dhv-result__card-info {
  width: 17px;
  height: 17px;
  display: inline-block;
  flex: none;
}
.dhv-result__card-info img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}
.dhv-ux[data-dhv-theme=dark] .dhv-result__card-info img {
  filter: brightness(0) invert(1);
}
.dhv-result__card-unit {
  font-size: 18px;
  color: #999999;
  white-space: nowrap;
  flex: none;
  padding-top: 2px;
}
.dhv-result__card-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-top: 8px;
}
.dhv-result__card-label {
  font-size: 18px;
  color: var(--dhv-color-font-contents);
}
.dhv-result__card-value {
  font-size: 24px;
  font-weight: 700;
  color: var(--dhv-color-font-title);
  white-space: nowrap;
}
.dhv-result__card-range {
  font-size: 16px;
  color: var(--dhv-color-font-contents);
  white-space: nowrap;
}
.dhv-result__card-chip {
  font-size: 12px;
  color: var(--dhv-color-font-title);
  border: 1px solid var(--dhv-color-border);
  border-radius: 6px;
  padding: 5px 10px;
  background: var(--dhv-color-surface);
}
.dhv-result__chart {
  background: var(--dhv-color-surface);
  border-radius: 10px;
  padding: 16px 18px;
  margin-bottom: 12px;
}
.dhv-result__chart-title {
  font-size: 21px;
  font-weight: 700;
  color: var(--dhv-color-font-title);
  margin-bottom: 10px;
}
.dhv-result__chart-plot {
  position: relative;
  padding: 16px 6px 30px 34px;
}
.dhv-result__chart-yticks {
  position: absolute;
  left: 0;
  top: 16px;
  bottom: 30px;
  width: 28px;
}
.dhv-result__chart-yticks span {
  position: absolute;
  right: 4px;
  transform: translateY(-50%);
  font-size: 14px;
  color: var(--dhv-color-font-contents);
}
.dhv-result__chart-xticks {
  position: absolute;
  left: 34px;
  right: 6px;
  bottom: 14px;
  height: 10px;
}
.dhv-result__chart-xticks span {
  position: absolute;
  transform: translateX(-50%);
  font-size: 14px;
  color: var(--dhv-color-font-contents);
}
.dhv-result__chart-plot svg {
  width: 100%;
  height: 120px;
  display: block;
}
.dhv-result__chart-y {
  position: absolute;
  left: 0;
  top: 0;
  font-size: 14px;
  color: var(--dhv-color-font-contents);
}
.dhv-result .dhv-detail-val--short {
  display: none;
}
[data-dhv-layout=mobile] .dhv-result .dhv-detail-val--full {
  display: none;
}
[data-dhv-layout=mobile] .dhv-result .dhv-detail-val--short {
  display: inline;
}
.dhv-result__chart-x {
  position: absolute;
  right: 6px;
  bottom: 0;
  font-size: 14px;
  color: var(--dhv-color-font-contents);
}
.dhv-result__note {
  font-size: 20px;
  font-weight: 400;
  line-height: 1.5;
  color: var(--dhv-color-font-contents);
  margin: 20px 6px;
}
.dhv-result__actions {
  display: flex;
  gap: 24px;
  margin: 18px 6px 0;
}
.dhv-result__exit,
.dhv-result__again {
  flex: 1;
  height: 82px;
  border-radius: 10px;
  font-family: inherit;
  font-weight: 600;
  font-size: 34px;
  cursor: pointer;
}
.dhv-result__exit {
  background: var(--dhv-color-secondary-cta-bg);
  color: var(--dhv-color-secondary-btn-text);
  border: 1.5px solid var(--dhv-color-secondary-cta-border);
}
.dhv-result__again {
  background: var(--dhv-color-primary-cta);
  color: var(--dhv-color-primary-btn-text);
  border: none;
}
.dhv-result__exit:focus-visible,
.dhv-result__again:focus-visible {
  outline: 2px solid var(--dhv-color-focused);
  outline-offset: 2px;
}
.dhv-result__powered {
  text-align: center;
  font-size: 14px;
  font-weight: 300;
  color: #666666;
  margin-top: 22px;
}
.dhv-result__nodata {
  position: fixed;
  inset: 0;
  z-index: 8;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(10, 12, 15, 0.55);
}
.dhv-result__nodata-box {
  width: min(86%, calc(420 * var(--u, 1px)));
  background: var(--dhv-color-surface);
  border-radius: calc(14 * var(--u, 1px));
  padding: calc(28 * var(--u, 1px)) calc(24 * var(--u, 1px));
  display: flex;
  flex-direction: column;
  gap: calc(12 * var(--u, 1px));
  text-align: center;
}
.dhv-result__nodata-title {
  margin: 0;
  font-weight: 700;
  font-size: calc(20 * var(--u, 1px));
  color: var(--dhv-color-font-title);
}
.dhv-result__nodata-desc {
  margin: 0 0 calc(8 * var(--u, 1px));
  font-size: calc(15 * var(--u, 1px));
  color: var(--dhv-color-font-contents);
}
.dhv-result__nodata-again {
  height: calc(48 * var(--u, 1px));
  border: none;
  border-radius: calc(10 * var(--u, 1px));
  background: var(--dhv-color-primary-cta);
  color: var(--dhv-color-primary-btn-text);
  font-family: inherit;
  font-weight: 600;
  font-size: calc(16 * var(--u, 1px));
  cursor: pointer;
}
.dhv-result__nodata-exit {
  height: calc(48 * var(--u, 1px));
  border-radius: calc(10 * var(--u, 1px));
  background: var(--dhv-color-secondary-cta-bg);
  color: var(--dhv-color-secondary-btn-text);
  border: calc(1.5 * var(--u, 1px)) solid var(--dhv-color-secondary-cta-border);
  font-family: inherit;
  font-weight: 600;
  font-size: calc(16 * var(--u, 1px));
  cursor: pointer;
}
[data-dhv-layout=mobile] .dhv-result__section {
  font-size: 18px;
}
[data-dhv-layout=mobile] .dhv-result__card-name {
  font-size: 16px;
}
[data-dhv-layout=mobile] .dhv-result__card-unit {
  font-size: 13px;
}
[data-dhv-layout=mobile] .dhv-result__card-label {
  font-size: 13px;
}
[data-dhv-layout=mobile] .dhv-result__card-value {
  font-size: 18px;
}
[data-dhv-layout=mobile] .dhv-result__card-range {
  font-size: 13px;
}
[data-dhv-layout=mobile] .dhv-result__disclaimer {
  font-size: 16px;
  white-space: pre-line;
  margin-top: 8px;
}
[data-dhv-layout=tablet-portrait] .dhv-result__disclaimer {
  font-size: 24px;
  white-space: pre-line;
  margin-top: 8px;
}
[data-dhv-layout=mobile] .dhv-result__note {
  font-size: 14px;
}
[data-dhv-layout=mobile] .dhv-result__chart-title {
  font-size: 16px;
}
[data-dhv-layout=mobile] .dhv-result__chart-yticks span,
[data-dhv-layout=mobile] .dhv-result__chart-xticks span,
[data-dhv-layout=mobile] .dhv-result__chart-y,
[data-dhv-layout=mobile] .dhv-result__chart-x {
  font-size: 10px;
}
[data-dhv-layout=mobile] .dhv-result__exit,
[data-dhv-layout=mobile] .dhv-result__again {
  height: 52px;
  font-size: 16px;
  font-weight: 500;
}
[data-dhv-layout=mobile] .dhv-result__actions {
  gap: 12px;
}
.dhv-result__card {
  position: relative;
}
.dhv-result__card-info {
  cursor: pointer;
}
.dhv-result__tip {
  position: absolute;
  left: 20px;
  top: 0;
  z-index: 5;
  max-width: min(320px, 86%);
  background: var(--dhv-color-surface);
  color: var(--dhv-color-font-title);
  border: 1px solid var(--dhv-color-border);
  border-radius: 10px;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.14);
  padding: 10px 14px;
  font-size: 15px;
  line-height: 1.4;
}
[data-dhv-layout=mobile] .dhv-result__tip {
  font-size: 13px;
  padding: 8px 12px;
}
/*# sourceMappingURL=main.css.map */