.passbox{display:grid;grid-template-columns:minmax(0,1fr)auto;gap:.375rem}.passbox>.btn{min-height:3rem}.input-wrap{position:relative;min-width:0}.input-wrap .input{min-height:3rem;padding-right:3.25rem;font-family:var(--font-mono);font-size:.9375rem}.reveal{position:absolute;top:50%;right:.3rem;display:grid;place-items:center;width:2.5rem;height:2.5rem;padding:0;color:var(--color-ink-3);background:0 0;border:0;border-radius:var(--radius-pill);cursor:pointer;translate:0 -50%;transition:color .2s,background-color .2s}.reveal:hover{color:var(--color-ink);background:var(--color-accent-soft)}.reveal:disabled{cursor:not-allowed;opacity:.55}.input-wrap:has(input[type=password]) .when-shown,.input-wrap:has(input[type=text]) .when-masked{display:none}.strength{display:flex;gap:var(--space-2);align-items:center;min-height:1.4rem;--fill:0}.strength::before{content:"";flex:none;box-sizing:border-box;width:4rem;height:.25rem;border-left:calc(4rem * var(--fill))solid var(--color-accent);border-radius:2px;background:var(--hair)}.strength:empty::before{display:none}.strength[data-level=short]{--fill:0.12}.strength[data-level=weak]{--fill:0.34}.strength[data-level=fair]{--fill:0.67}.strength[data-level=strong]{--fill:1}@media(max-width:40rem){.passbox{grid-template-columns:minmax(0,1fr)}.passbox>.btn{justify-self:start}}