:root{--bg:#070b10;--line:#2d3a4d;--text:#eaf0fb;--muted:#8f9bad;--blue:#9dbdff}.otp-page{min-height:100vh;margin:0;display:grid;place-items:center;background:radial-gradient(circle at 50% 35%,#14233a 0,transparent 32rem),var(--bg);color:var(--text);font-family:ui-sans-serif,system-ui,sans-serif;overflow:hidden}.otp-page:before{content:'';position:fixed;inset:0;background:repeating-linear-gradient(0deg,#ffffff02 0 1px,transparent 1px 4px);pointer-events:none}.otp-shell{width:min(100% - 32px,620px);min-height:650px;border:1px solid var(--line);background:linear-gradient(145deg,#0c121b,#080c12);box-shadow:0 35px 100px #000b;display:flex;flex-direction:column;position:relative;overflow:hidden}.otp-shell:before{content:'';position:absolute;width:350px;height:350px;border-radius:50%;background:#2d6bff16;filter:blur(55px);top:110px;left:130px}.otp-top{height:52px;border-bottom:1px solid #263243;display:flex;align-items:center;justify-content:space-between;padding:0 14px;position:relative;font:600 10px ui-monospace;color:#c8d3e9}.window-dots{display:flex;gap:6px}.window-dots i{width:8px;height:8px;border-radius:50%;background:#fb5d67}.window-dots i:nth-child(2){background:#f6ce59}.window-dots i:nth-child(3){background:#5de088}.otp-top>span:last-child{font-size:8px;color:#7990ad}.otp-content{z-index:1;display:flex;flex:1;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:60px 20px}.otp-kicker{font:9px ui-monospace;letter-spacing:.15em;color:#768399}.otp-content h1{font-size:clamp(31px,5vw,43px);letter-spacing:-.07em;margin:10px 0 7px}.otp-content h1 em{font-style:normal;color:#9eb5d3;font-size:.45em;text-transform:uppercase;letter-spacing:.05em;vertical-align:middle}.otp-content>p{color:var(--muted);font-size:12px;margin:0}.otp-error{color:#ff9ba8!important;margin-top:12px!important}.otp-content form{margin-top:30px}.card-deck{height:115px;display:flex;align-items:center;justify-content:center;padding:0 12px}.otp-card{width:60px;height:70px;background:linear-gradient(145deg,#263559,#15213d);border:1px solid #536fae;border-radius:12px;display:grid;place-items:center;margin-left:-10px;box-shadow:0 10px 19px #0008;position:relative;transform:rotate(-9deg);transition:.2s;cursor:text}.otp-card:nth-child(2){transform:rotate(-3deg);z-index:2}.otp-card:nth-child(3){transform:rotate(4deg);z-index:3}.otp-card:nth-child(4){transform:rotate(10deg);z-index:4}.otp-card:hover,.otp-card:focus-within{transform:translateY(-11px) rotate(0deg);border-color:#a7c5ff;z-index:10}.otp-card input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:text}.otp-card b{font:700 23px ui-monospace;color:#e7efff;text-shadow:0 0 13px #a0bfff}.otp-submit{border:1px solid #3e5b93;background:#151e31;color:#e2ebff;padding:10px 20px;border-radius:5px;font:600 11px ui-sans-serif;cursor:pointer}.otp-submit:hover{background:#23335a}.otp-submit span{margin-left:24px;color:var(--blue)}.otp-help{font-size:9px!important;margin-top:26px!important;color:#667285!important}.otp-shell footer{position:relative;z-index:1;display:grid;grid-template-columns:repeat(3,1fr);gap:5px;padding:12px;border-top:1px solid #263243;font:8px ui-monospace;color:#7590ae}.otp-shell footer span{background:#101927;border:1px solid #253349;padding:8px}@media(max-width:500px){.otp-shell{min-height:580px}.otp-content{padding:35px 15px}.otp-card{width:54px;height:65px}.otp-top>b{font-size:9px}.otp-top>span:last-child{display:none}}