.otp-input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.otp-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.otp-container{align-items:center;gap:8px;display:inline-flex}.otp-container.otp-sm{gap:6px}.otp-container.otp-lg{gap:10px}.otp-disabled{opacity:.5;pointer-events:none}.otp-input{text-align:center;caret-color:#3b82f6;-moz-appearance:textfield;background:0 0;border:none;outline:none;font-family:ui-monospace,SFMono-Regular,SF Mono,Menlo,Consolas,monospace;font-weight:600;transition:border-color .15s,box-shadow .15s,background-color .15s}.otp-input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.otp-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.otp-input::placeholder{color:#ccc;font-weight:400}.otp-outline .otp-input{border:2px solid #d1d5db;border-radius:8px}.otp-outline .otp-input--focused{border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f626}.otp-outline .otp-input--filled{border-color:#9ca3af}.otp-outline .otp-input--error{border-color:#ef4444}.otp-outline .otp-input--error.otp-input--focused{box-shadow:0 0 0 3px #ef444426}.otp-filled .otp-input{background:#f3f4f6;border:2px solid #0000;border-radius:8px}.otp-filled .otp-input--focused{background:#fff;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f626}.otp-filled .otp-input--filled{background:#e5e7eb}.otp-filled .otp-input--error{background:#fef2f2;border-color:#ef4444}.otp-underline .otp-input{border-bottom:2px solid #d1d5db;border-radius:0}.otp-underline .otp-input--focused{border-bottom-color:#3b82f6}.otp-underline .otp-input--filled{border-bottom-color:#6b7280}.otp-underline .otp-input--error{border-bottom-color:#ef4444}.otp-separator{color:#9ca3af;-webkit-user-select:none;user-select:none;font-size:20px;font-weight:300;line-height:1}input[type=password].otp-input{font-size:28px}*{box-sizing:border-box;margin:0;padding:0}body{color:#222;background:#f5f5f5;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;line-height:1.6}.page{max-width:560px;margin:0 auto;padding:48px 24px 80px}header{text-align:center;margin-bottom:48px}h1{margin-bottom:4px;font-size:32px;font-weight:700}.tagline{color:#666;margin-bottom:16px;font-size:16px}.badges{justify-content:center;gap:8px;margin-bottom:16px;display:flex}.badges img{height:20px}.install{color:#e0e0e0;background:#1a1a2e;border-radius:8px;padding:10px 20px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:14px;display:inline-block}section{background:#fff;border-radius:12px;margin-bottom:16px;padding:24px;box-shadow:0 1px 3px #0000000f}h2{color:#333;margin-bottom:4px;font-size:16px;font-weight:600}.desc{color:#888;margin-bottom:14px;font-size:13px}.demo-row{justify-content:center;padding:8px 0;display:flex}.result{color:#555;flex-wrap:wrap;justify-content:center;gap:16px;margin-top:12px;font-size:13px;display:flex}.error-msg{color:#ef4444;text-align:center;margin-top:8px;font-size:13px}.btn{cursor:pointer;background:#fff;border:1px solid #d0d5dd;border-radius:6px;margin-top:10px;padding:6px 16px;font-size:13px;transition:background .1s}.btn:hover{background:#f5f5f5}.btn-row{justify-content:center;gap:8px;margin-top:10px;display:flex}footer{text-align:center;color:#999;margin-top:48px;font-size:13px}footer a{color:#666;text-decoration:none}footer a:hover{color:#333;text-decoration:underline}footer span{margin:0 6px}