.otp-root[data-v-c9410bbd] { display: inline-flex; position: relative; }
.otp-hidden[data-v-c9410bbd] { opacity: 0; pointer-events: none; width: 1px; height: 1px; position: absolute; }
.otp-cells[data-v-c9410bbd] { align-items: center; gap: 8px; display: flex; }
.otp-separator[data-v-c9410bbd] { align-items: center; padding: 0px 4px; display: flex; }
.otp-separator-dash[data-v-c9410bbd] { background: var(--color-brand-border-dark); opacity: 0.6; border-radius: 2px; width: 12px; height: 2.5px; }
.otp-cell-wrap[data-v-c9410bbd] { position: relative; }
.otp-cell-wrap.is-focused[data-v-c9410bbd]:not(.is-filled)::before { content: ""; z-index: 3; background: rgba(224, 123, 79, 0.75); border-radius: 1px; width: 2px; height: 24px; animation: 1.1s ease-in-out 0s infinite normal none running otpCursorBlink-c9410bbd; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
.otp-cell-glow[data-v-c9410bbd] { opacity: 0; pointer-events: none; z-index: 0; background: radial-gradient(rgba(224, 123, 79, 0.25), rgba(0, 0, 0, 0) 70%); border-radius: 16px; transition: opacity 0.4s cubic-bezier(0.16, 1, 0.3, 1); position: absolute; inset: -5px; }
.is-focused .otp-cell-glow[data-v-c9410bbd] { opacity: 1; }
.otp-complete .otp-cell-glow[data-v-c9410bbd] { background: radial-gradient(rgba(16, 185, 129, 0.2), rgba(0, 0, 0, 0) 70%); }
.otp-cell[data-v-c9410bbd] { text-align: center; font-feature-settings: "tnum"; font-variant-numeric: tabular-nums; letter-spacing: 0.5px; width: 52px; height: 62px; color: var(--color-text-primary); border: 1.5px solid var(--color-brand-border-dark); caret-color: rgba(0, 0, 0, 0); z-index: 1; cursor: pointer; background: rgba(255, 255, 255, 0.85); border-radius: 12px; outline: none; font-size: 26px; font-weight: 700; transition: border-color 0.25s, background-color 0.25s, box-shadow 0.4s cubic-bezier(0.16, 1, 0.3, 1), transform 0.3s cubic-bezier(0.16, 1, 0.3, 1); position: relative; box-shadow: rgba(0, 0, 0, 0.03) 0px 1px 2px inset, rgba(0, 0, 0, 0.05) 0px 1px 3px; }
.otp-cell[data-v-c9410bbd]:hover { border-color: rgba(224, 123, 79, 0.35); }
.is-focused .otp-cell[data-v-c9410bbd] { background: var(--color-card,#fff); border-color: rgba(224, 123, 79, 0.6); transform: translateY(-2px); box-shadow: rgba(224, 123, 79, 0.2) 0px 0px 0px 1px, rgba(224, 123, 79, 0.12) 0px 4px 12px, rgba(224, 123, 79, 0.06) 0px 8px 24px; }
.is-filled .otp-cell[data-v-c9410bbd] { background: rgba(255, 255, 255, 0.95); border-color: rgba(224, 123, 79, 0.25); box-shadow: rgba(0, 0, 0, 0.04) 0px 1px 4px; }
.is-filled.is-focused .otp-cell[data-v-c9410bbd] { background: var(--color-card,#fff); border-color: rgba(224, 123, 79, 0.6); box-shadow: rgba(224, 123, 79, 0.2) 0px 0px 0px 1px, rgba(224, 123, 79, 0.12) 0px 4px 12px, rgba(224, 123, 79, 0.06) 0px 8px 24px; }
.is-pop .otp-cell[data-v-c9410bbd] { animation: 0.35s cubic-bezier(0.34, 1.56, 0.64, 1) 0s 1 normal none running otpDigitPop-c9410bbd; }
.otp-complete .otp-cell[data-v-c9410bbd] { background: rgba(16, 185, 129, 0.03); border-color: rgba(16, 185, 129, 0.35); }
.otp-complete .is-focused .otp-cell[data-v-c9410bbd] { border-color: rgba(16, 185, 129, 0.6); box-shadow: rgba(16, 185, 129, 0.2) 0px 0px 0px 1px, rgba(16, 185, 129, 0.1) 0px 4px 12px, rgba(16, 185, 129, 0.05) 0px 8px 24px; }
.otp-complete .otp-separator-dash[data-v-c9410bbd] { background: rgba(16, 185, 129, 0.4); }
.otp-invalid .otp-cell[data-v-c9410bbd] { background: rgba(254, 242, 242, 0.9); border-color: rgba(220, 38, 38, 0.55); }
.otp-invalid .is-focused .otp-cell[data-v-c9410bbd] { border-color: rgba(220, 38, 38, 0.7); box-shadow: rgba(220, 38, 38, 0.2) 0px 0px 0px 1px, rgba(220, 38, 38, 0.12) 0px 4px 12px; }
.otp-invalid .otp-cell-glow[data-v-c9410bbd] { background: radial-gradient(rgba(220, 38, 38, 0.18), rgba(0, 0, 0, 0) 70%); }
.otp-invalid .otp-separator-dash[data-v-c9410bbd] { background: rgba(220, 38, 38, 0.45); }
.otp-shaking .otp-cells[data-v-c9410bbd] { animation: 0.4s cubic-bezier(0.36, 0.07, 0.19, 0.97) 0s 1 normal none running otpShake-c9410bbd; }
.otp-disabled .otp-cell[data-v-c9410bbd] { cursor: default; opacity: 0.6; }
@keyframes otpShake-c9410bbd { 
  0%, 100% { transform: translate(0px); }
  20% { transform: translate(-6px); }
  40% { transform: translate(5px); }
  60% { transform: translate(-3px); }
  80% { transform: translate(2px); }
}
@keyframes otpDigitPop-c9410bbd { 
  0% { transform: scale(0.85); }
  50% { transform: scale(1.06) translateY(-3px); }
  100% { transform: scale(1); }
}
@keyframes otpCursorBlink-c9410bbd { 
  0%, 100% { opacity: 1; }
  50% { opacity: 0; }
}
@media (width <= 480px) {
  .otp-cells[data-v-c9410bbd] { gap: 6px; }
  .otp-cell[data-v-c9410bbd] { border-radius: 10px; width: 44px; height: 54px; font-size: 22px; }
  .otp-separator[data-v-c9410bbd] { padding: 0px 2px; }
  .otp-separator-dash[data-v-c9410bbd] { width: 8px; }
  .otp-cell-wrap.is-focused[data-v-c9410bbd]:not(.is-filled)::before { height: 20px; }
}
@media (width <= 400px) {
  .otp-cells[data-v-c9410bbd] { gap: 5px; }
  .otp-cell[data-v-c9410bbd] { width: 40px; height: 50px; font-size: 20px; }
}
@media (prefers-reduced-motion: reduce) {
  .otp-cell[data-v-c9410bbd], .otp-cell-glow[data-v-c9410bbd] { transition: none !important; }
  .is-pop .otp-cell[data-v-c9410bbd], .otp-cell-wrap.is-focused[data-v-c9410bbd]:not(.is-filled)::before, .otp-shaking .otp-cells[data-v-c9410bbd] { animation: auto ease 0s 1 normal none running none !important; }
}
@media screen {
  .dark .otp-cell[data-v-c9410bbd], .dark .is-filled .otp-cell[data-v-c9410bbd] { background: var(--color-input-background); box-shadow: none; }
  .dark .is-focused .otp-cell[data-v-c9410bbd], .dark .is-filled.is-focused .otp-cell[data-v-c9410bbd] { background: var(--color-input-background); }
}