.verification-code-field--{display:flex;align-items:center;justify-content:center;gap:8px;position:relative}.verification-code-field-- .verification-code-field-input{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0}.verification-code-field-- .verification-code-field-character{display:flex;justify-content:center;align-items:center;text-align:center;background:#040714;border:2px solid transparent;width:50px;height:55px;border-radius:4px;background:var(--color-black);color:rgba(var(--color-white-rgb),.2)}.verification-code-field-- .verification-code-field-character span{display:flex;align-items:center;justify-content:center;min-width:20px;height:32px;font-size:1rem;line-height:1.5em;border:2px solid transparent}.verification-code-field-- .verification-code-field-character.filled{color:var(--color-white);border-color:var(--color-blue)}.verification-code-field--:focus-within .verification-code-field-character.active{background:linear-gradient(180deg,#055efacc,#055efa),#055efa;border-top-color:transparent}.verification-code-field--:focus-within .verification-code-field-character.active span{border-bottom:2px solid #fff}