:root{--color-white:#fff;--color-black:#000;--color-dark-gray:#1a1a1a;--color-light-gray:#999;--color-red:#f53d3d;--color-dark-orange:#f63;--color-med-orange:#f73;--color-light-orange:#f96;--color-pale-yellow:ivory;--color-beige:#c96;--color-green:#6c3;--color-blue:#6cf;--color-app-background:var(--color-dark-gray);--color-app-text:var(--color-white);--color-input-text:var(--color-black);--color-input-text-placeholder:var(--color-black);--color-input-text-focus:var(--color-black);--color-input-border-focus:var(--color-dark-orange);--color-input-background-focus:var(--color-pale-yellow);--color-input-text-placeholder-focus:var(--color-beige);--color-input-shadow-focus:var(--color-light-orange);--color-status-match:var(--color-green);--color-status-mismatch:var(--color-red);--font-family-sans-serif:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--font-family-monospace:"SF Mono", SFMono-Regular, ui-monospace, "DejaVu Sans Mono", Menlo, Consolas, monospace;--font-size-xxs:calc(1rem * 13 / 16);--font-size-xs:calc(1rem * 14 / 16);--font-size-s:calc(1rem * 15 / 16);--font-size-m:1rem;--font-size-l:calc(1rem * 20 / 16);--font-size-xl:calc(1rem * 24 / 16);--font-size-xxl:calc(1rem * 32 / 16);--line-height-normal:1.3;--font-family-primary:var(--font-family-sans-serif);--font-family-password-input:var(--font-family-monospace);--font-size-text:var(--font-size-m);--font-size-heading:var(--font-size-xxl);--font-size-author-link:var(--font-size-xxs);--font-size-password-label:var(--font-size-l);--font-size-password-input:var(--font-size-xl);--font-size-reveal-passwords:var(--font-size-xs);--font-size-match-status:var(--font-size-xl);--line-height-app-text:var(--line-height-normal)}*{box-sizing:border-box}body{background-color:var(--color-app-background);font-family:var(--font-family-primary);text-align:left;line-height:var(--line-height-app-text);color:var(--color-app-text);margin:0 auto}.app-wrapper{display:contents}.app{max-width:550px;margin:0 auto;padding:0 30px}h1{text-align:center;margin-top:2rem}a{color:var(--color-blue)}.author-link{opacity:.75;font-size:var(--font-size-author-link);color:inherit;text-decoration:none;position:absolute;top:5px;right:10px}.author-link .by{font-size:.7rem}.author-link:hover{opacity:1}p.disclaimer{margin-top:var(--font-size-xxl)}form{text-align:right;margin:0 auto}.field{font-size:inherit;flex-direction:column;justify-content:center;align-items:flex-start;margin-top:5px;display:flex;position:relative}label{font-size:var(--font-size-password-label)}.field[data-field-id=reveal-passwords]{margin-top:var(--font-size-xl);flex-direction:row;justify-content:flex-end;align-items:center;margin-bottom:5px;display:flex}.field[data-field-id=reveal-passwords] label{font-size:var(--font-size-reveal-passwords)}label[for=reveal-passwords]{margin-right:0;font-size:1rem}input#reveal-passwords{margin-right:0}input.password{width:100%;font-family:var(--font-family-password-input);font-size:var(--font-size-password-input);vertical-align:middle;background-clip:padding-box;border:1px solid #00000059;border-radius:3px;margin:5px 0;padding:12px}input.password::placeholder{color:#999;transition:color .25s ease-in-out}input.password:focus{border-color:var(--color-input-border-focus);background-color:var(--color-input-background-focus);box-shadow:0 0 5px 1px var(--color-input-shadow-focus);color:var(--color-input-text-focus);outline-width:0}input.password:focus::placeholder{color:var(--color-input-text-placeholder-focus)}.password-length{opacity:.5;font-size:var(--font-size-password-label);margin-left:20px;position:absolute;top:0;right:0}.match-status-container{visibility:hidden}.match-status-container.visible{visibility:visible}.match-status{font-size:var(--font-size-match-status);text-align:right;margin:0}.matching{color:var(--color-status-match)}.not-matching{color:var(--color-status-mismatch)}