.pin-control{width:100%;max-width:390px;margin:0 0 19px;min-width:0}
.pin-control .pin-label{margin:0 0 9px;font-size:13px;font-weight:650}
.pin-entry{position:relative;min-width:0;border-radius:var(--theme-radius,9px)}
.pin-entry .pin-value{position:absolute;inset:0;width:100%;height:100%;min-height:0;margin:0;z-index:2;opacity:0;font-size:20px;cursor:text;letter-spacing:.25em;direction:ltr}
.pin-slots{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:clamp(5px,1.5vw,10px);pointer-events:none}
.pin-slot{display:grid;place-items:center;aspect-ratio:1/1.1;min-height:44px;max-height:64px;border:1px solid var(--tone-17);border-radius:var(--theme-radius,9px);background:var(--tone-3);color:var(--ink);font-size:clamp(22px,5vw,27px);font-weight:600;font-variant-numeric:tabular-nums;line-height:1;transition:border-color .12s,box-shadow .12s;direction:ltr}
.pin-slot.is-filled{border-color:var(--gold)}
.pin-slot.is-current{border-color:var(--gold);outline:2px solid var(--gold);outline-offset:2px;box-shadow:0 0 0 4px var(--tone-23)}
.pin-tools{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:3px;min-height:40px}
.pin-tools small{color:var(--muted);font-size:11px;font-weight:400}
.pin-tools .pin-reveal{min-height:44px;padding:6px 0 6px 12px;font-size:12px;color:var(--gold);text-decoration:underline;text-underline-offset:3px}
.pin-entry:has(input:disabled){opacity:.6}.pin-control:has(input:user-invalid) .pin-slot{border-color:var(--error)}
.registration-copy{white-space:pre-wrap;overflow-wrap:anywhere}
.registration-preview{padding:22px;border:1px solid var(--line);border-radius:var(--theme-radius,9px);background:var(--paper);color:var(--ink);max-width:410px;margin:18px auto 0}
.registration-preview h3{font-size:23px;margin:0 0 12px;font-family:var(--heading-font,inherit)}
.registration-preview p{font-size:13px;margin:0 0 18px;line-height:1.6}
.registration-preview small{display:block;color:var(--muted);font-size:12px;margin:12px 0}
.registration-preview .pin-slots{margin:10px 0 18px}
.registration-preview .preview-pin-label{font-size:13px;font-weight:600}
@media(prefers-reduced-motion:reduce){.pin-slot{transition:none}}
@media(forced-colors:active){.pin-slot{border:1px solid ButtonText}.pin-slot.is-current{outline:2px solid Highlight}}