.demo-obscured {
  filter: blur(5px);
  opacity: 0.48;
  pointer-events: none;
  user-select: none;
}

.topbar.demo-obscured {
  filter: blur(4px);
  opacity: 0.42;
}

.kyc-card {
  position: relative;
  z-index: 2;
  box-shadow: 0 20px 55px rgba(16, 38, 62, 0.16), 0 0 0 3px rgba(96, 213, 174, 0.08);
}

.integration-nudge {
  position: relative;
  z-index: 3;
  width: min(430px, calc(100% - 32px));
  margin: -10px 26px 13px auto;
  padding: 3px 48px 2px 10px;
  color: #265f59;
  font-family: "Segoe Print", "Bradley Hand", "Comic Sans MS", cursive;
  text-align: right;
  transform: rotate(-1.5deg);
}

.integration-nudge strong,
.integration-nudge small {
  display: block;
}

.integration-nudge strong {
  font-size: 1.03rem;
  line-height: 1.3;
}

.integration-nudge small {
  margin-top: 2px;
  color: #54756f;
  font-size: 0.76rem;
  line-height: 1.45;
}

.scribble-arrow {
  position: absolute;
  right: 5px;
  bottom: -17px;
  color: #2f907e;
  font-size: 2.65rem;
  font-weight: 700;
  line-height: 1;
  transform: rotate(8deg);
}

@media (max-width: 640px) {
  .integration-nudge {
    width: calc(100% - 18px);
    margin: -7px 9px 12px auto;
    padding-right: 42px;
  }

  .integration-nudge strong {
    font-size: 0.9rem;
  }

  .integration-nudge small {
    font-size: 0.7rem;
  }
}

@media (prefers-reduced-transparency: reduce) {
  .demo-obscured {
    filter: none;
    opacity: 0.22;
  }
}