.verification-backdrop {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: grid;
  place-items: center;
  padding: 20px;
  background: rgba(8, 24, 58, .72);
  backdrop-filter: blur(5px);
}

.verification-backdrop[hidden] { display: none; }

.verification-card {
  width: min(100%, 460px);
  padding: 32px;
  border-radius: 26px;
  background: #fff;
  box-shadow: 0 28px 80px rgba(5, 26, 74, .28);
  color: #071b42;
}

.verification-mark {
  display: grid;
  width: 58px;
  height: 58px;
  place-items: center;
  margin-bottom: 18px;
  border-radius: 18px;
  background: linear-gradient(135deg, #72d31d, #32ad44);
  color: #fff;
  font-size: 28px;
  font-weight: 900;
}

.verification-card h2 { margin: 0 0 10px; font-size: 28px; line-height: 1.1; }
.verification-card p { margin: 0 0 20px; color: #52627d; line-height: 1.55; }
.verification-card strong { color: #071b42; overflow-wrap: anywhere; }

.verification-code {
  width: 100%;
  box-sizing: border-box;
  padding: 16px;
  border: 2px solid #dbe3f0;
  border-radius: 14px;
  outline: none;
  color: #071b42;
  background: #f7f9fd;
  font: 800 28px/1 monospace;
  text-align: center;
  letter-spacing: .3em;
}

.verification-code:focus { border-color: #1645e8; box-shadow: 0 0 0 4px rgba(22, 69, 232, .12); }
.verification-actions { display: grid; gap: 10px; margin-top: 16px; }
.verification-primary, .verification-secondary, .verification-change {
  min-height: 48px;
  border: 0;
  border-radius: 13px;
  cursor: pointer;
  font: 800 15px/1 sans-serif;
}
.verification-primary { background: #1645e8; color: #fff; }
.verification-secondary { background: #edf2ff; color: #1645e8; }
.verification-change { min-height: auto; margin-top: 14px; background: transparent; color: #65718a; }
.verification-message { min-height: 22px; margin: 12px 0 0 !important; font-size: 14px; font-weight: 700; }
.verification-message.error { color: #d13b2f; }
.verification-message.success { color: #258b30; }
.verification-help { padding: 12px 14px; border-radius: 12px; background: #fff7d6; color: #725600 !important; font-size: 13px; }

@media (max-width: 520px) {
  .verification-card { padding: 24px 20px; border-radius: 20px; }
  .verification-card h2 { font-size: 24px; }
}