/* Scoped to OTP fields; all colors inherit the existing six skins. */
.r1-code-input{position:relative;isolation:isolate;box-sizing:border-box;width:min(100%,360px);min-width:0;margin:3px auto 7px;direction:ltr}
.r1-code-cells{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:clamp(5px,1.7vw,10px);pointer-events:none}
.r1-code-cell{box-sizing:border-box;display:grid;place-items:center;min-width:0;min-height:56px;border:1px solid var(--r1-muted);border-radius:12px;background:var(--r1-raised);color:var(--r1-ink);font:600 clamp(23px,6.5vw,29px)/1 var(--b27-ui-font,Montserrat),system-ui,sans-serif;font-variant-numeric:tabular-nums;transition:border-color .12s ease,box-shadow .12s ease}
.r1-code-cell.is-active{border-color:var(--r1-link);box-shadow:0 0 0 2px var(--r1-link)}
.r1-code-cell.is-active:empty::after{content:"";width:2px;height:24px;border-radius:1px;background:var(--r1-link)}
.r1-code-input.is-invalid .r1-code-cell{border-style:dashed}
.r1-code-input.is-disabled{opacity:.58}
/* Keep a real, focusable, autofill-eligible input over all six cells. */
html[data-theme][data-b27-skin] body .r1-code-input>input.r1-code-native,
html body #accountPanel .r1-code-input>input.r1-code-native{position:absolute!important;inset:0!important;z-index:1!important;box-sizing:border-box!important;width:100%!important;height:100%!important;min-width:0!important;min-height:0!important;margin:0!important;padding:0!important;border:0!important;border-radius:0!important;outline:0!important;background:transparent!important;box-shadow:none!important;color:transparent!important;-webkit-text-fill-color:transparent!important;caret-color:transparent!important;font:400 16px/1 system-ui,sans-serif!important;letter-spacing:0!important;opacity:1!important;appearance:none!important;-webkit-appearance:none!important;cursor:text;direction:ltr}
html body .r1-code-input>input.r1-code-native::selection{color:transparent;background:transparent}
@media(forced-colors:active){.r1-code-cell{border-color:CanvasText;color:CanvasText;background:Canvas}.r1-code-cell.is-active{border-color:Highlight;outline:2px solid Highlight;box-shadow:none}.r1-code-cell.is-active:empty::after{background:Highlight}}
@media(prefers-reduced-motion:reduce){.r1-code-cell{transition:none}}
