/* Identity verification wizard (3 steps) */
.modal.kyc-box { width: min(36rem, 100%); padding: 1.7rem 1.9rem 1.6rem; max-height: 94vh; overflow-y: auto; }
.kyc-title { margin: 0 0 1.3rem; text-align: center; font-size: 1.3rem; font-weight: 500; color: #d9dbe2; letter-spacing: .01em; }

.kyc-steps { list-style: none; margin: 0 0 1.5rem; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.kyc-step { position: relative; display: grid; justify-items: center; gap: .55rem; text-align: center; color: #8d909c; font-size: .8rem; }
.kyc-step::before { content: ''; position: absolute; top: 1.15rem; right: 50%; width: 100%; border-top: 1.5px dashed #3b3d46; z-index: 0; }
.kyc-step:first-child::before { display: none; }
.kyc-step.done::before, .kyc-step.on::before { border-top-color: #f2b90c; }
.kyc-dot { position: relative; z-index: 1; width: 2.3rem; height: 2.3rem; border-radius: 50%; display: grid; place-items: center; background: #34363d; color: #c3c6d0; font-weight: 600; font-size: .95rem; transition: background .2s, color .2s; }
.kyc-step.on .kyc-dot, .kyc-step.done .kyc-dot { background: #f2b90c; color: #1b1300; }
.kyc-step.on { color: #e8eaf0; }
.kyc-step-l { max-width: 7.5rem; line-height: 1.3; }

.kyc-form { display: grid; gap: 1rem; }
.kyc-two { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.kyc-f { display: grid; gap: .4rem; font-size: .82rem; color: #aab0c0; font-weight: 500; min-width: 0; }
.kyc-f input, .kyc-f select { background: #26282f; border: 1px solid #343741; border-radius: 8px; padding: .75rem .85rem; font-size: .92rem; color: var(--text); color-scheme: dark; }
.kyc-f input::placeholder { color: #6f7382; }
.kyc-f input:focus, .kyc-f select:focus { border-color: #f2b90c; outline: none; box-shadow: 0 0 0 3px rgba(242, 185, 12, .15); }

.kyc-primary { width: 100%; background: #f2b90c; color: #1b1300; border: 0; border-radius: 8px; padding: .85rem 1rem; font-size: .95rem; font-weight: 600; cursor: pointer; }
.kyc-primary:hover:not(:disabled) { background: #f7c52d; }
.kyc-primary:disabled { opacity: .6; cursor: default; }
.kyc-back { display: block; margin: .6rem auto 0; background: transparent; border: 0; color: #c3c6d0; font-size: .88rem; padding: .5rem 1rem; cursor: pointer; }
.kyc-back:hover { color: #fff; }

.kyc-tips { margin: 0 0 1.1rem; padding: 0 0 0 1.1rem; display: grid; gap: .55rem; color: #b6bac6; font-size: .86rem; line-height: 1.5; }
.kyc-side { margin-bottom: 1.1rem; }
.kyc-side-l { font-size: .85rem; color: #c3c6d0; font-weight: 500; margin-bottom: .55rem; }
.kyc-pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .9rem; }
.kyc-file { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }

.kyc-drop { position: relative; width: 100%; aspect-ratio: 4 / 3; display: grid; place-content: center; justify-items: center; gap: .5rem; padding: .6rem; background: #20222a; border: 1.5px dashed #444853; border-radius: 10px; color: #8d93a3; font-size: .84rem; cursor: pointer; overflow: hidden; transition: border-color .15s, background .15s, color .15s; }
.kyc-drop:hover { border-color: #f2b90c; color: #f2b90c; background: #23252d; }
.kyc-drop.filled { border-style: solid; border-color: #3a3d47; padding: 0; }
.kyc-drop img { width: 100%; height: 100%; object-fit: cover; display: block; }
.kyc-redo { position: absolute; left: .5rem; bottom: .5rem; display: inline-flex; align-items: center; gap: .3rem; background: rgba(15, 16, 20, .78); color: #fff; border-radius: 6px; padding: .3rem .55rem; font-size: .74rem; }
.kyc-have { width: 3rem; height: 3rem; border-radius: 50%; display: grid; place-items: center; background: rgba(18, 184, 134, .16); color: #2fd3a0; }
.kyc-drop.filled:not(:has(img)) { padding: .6rem; border-color: #2c6b57; }
.kyc-drop.filled:not(:has(img)) .kyc-redo { position: static; background: transparent; color: #8d93a3; padding: 0; }

.kyc-sample { aspect-ratio: 4 / 3; display: grid; place-content: center; justify-items: center; gap: .4rem; background: #f4f7fc; border-radius: 10px; padding: .7rem; color: #65708a; font-size: .74rem; }
.kyc-sample-svg { width: 82%; height: auto; }

.kyc-privacy { display: flex; gap: .5rem; align-items: flex-start; margin: .2rem 0 1rem; color: #8d93a3; font-size: .78rem; line-height: 1.45; }
.kyc-privacy svg { flex: none; margin-top: .1rem; }
.kyc-body .down:not(:empty) { margin: 0 0 .8rem; }

.kyc-done { display: grid; justify-items: center; gap: .8rem; text-align: center; padding: .6rem 0 .2rem; }
.kyc-done h3 { margin: 0; font-size: 1.15rem; font-weight: 500; }
.kyc-done p { margin: 0 0 .6rem; color: #aab0c0; font-size: .88rem; line-height: 1.55; max-width: 26rem; }
.kyc-done-ic { width: 3.6rem; height: 3.6rem; border-radius: 50%; display: grid; place-items: center; background: #f2b90c; color: #1b1300; }

@media (max-width: 520px) {
  .modal.kyc-box { padding: 1.3rem 1rem 1.2rem; }
  .kyc-two { grid-template-columns: 1fr; gap: .8rem; }
  .kyc-pair { gap: .6rem; }
  .kyc-step-l { font-size: .72rem; }
}

.kyc-admin-img { display: block; max-width: 100%; max-height: 70vh; margin: .8rem auto; border-radius: 8px; background: #0e0f12; }

.kyc-done h3 { text-transform: none; letter-spacing: 0; color: #e8eaf0; font-size: 1.15rem; }
.kyc-f input, .kyc-f select { font-weight: 400; }