.deepnet-totp{max-width:720px;margin:1rem auto;padding:1rem;border:1px solid #e5e7eb;border-radius:1rem;background:#fff}
.deepnet-totp__row{display:flex;flex-direction:column;gap:.25rem;margin-bottom:1rem}
.deepnet-totp__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin-bottom:1rem}
@media (max-width:768px){.deepnet-totp__grid{grid-template-columns:repeat(2,1fr)}}
.deepnet-totp label{font-weight:600}
.deepnet-totp input[type="text"], .deepnet-totp select{width:100%;padding:.5rem .6rem;border:1px solid #d1d5db;border-radius:.5rem}
.deepnet-totp .hint{color:#6b7280;font-size:.85rem}
.deepnet-totp__actions{display:flex;gap:.5rem;margin-bottom:1rem}
.deepnet-totp__result{display:flex;flex-direction:column;gap:.5rem}
.deepnet-totp__code{font-size:2.5rem;font-weight:700;letter-spacing:.15em;font-variant-numeric:tabular-nums}
.deepnet-totp__meta{color:#374151}
.deepnet-totp__progress{width:100%;height:.5rem;background:#f3f4f6;border-radius:.5rem;overflow:hidden}
.deepnet-totp__progress>div{height:100%;width:0%;background:#3b82f6;transition:width .2s ease}
.button{border-radius:.5rem}