:root{font-size:75%;font-family:Segoe UI,system-ui,sans-serif;color:#f4f4f4;background:#2b4254}html,body{min-height:100%;margin:0}#app{min-height:100vh}.site-shell{display:flex;flex-direction:column;min-height:100vh;background:#2b4254}.site-header{display:flex;min-height:4.5rem;background:#566879}.site-logo{display:grid;flex:0 0 18.25rem;align-items:center;justify-content:center;color:#f7f7f7;font-size:1.875rem;font-weight:300;text-decoration:none}.site-search{display:flex;align-items:stretch}.site-search input{box-sizing:border-box;width:22rem;border:0;padding:0 1.75rem;color:#4d5d6c;font:inherit;font-size:1.625rem;font-weight:300}.site-search input::placeholder{color:#c9c9c9}.site-search button{width:8rem;border:0;background:#566879;color:#f7f7f7;font:inherit;font-size:1.5rem;font-weight:300;cursor:pointer}.site-header nav{display:flex;align-items:center;padding:0 2rem}.site-header nav a{color:#f7f7f7;font-size:1.25rem;font-weight:300;text-decoration:none}.page-content{display:grid;flex:1;place-items:center;padding:2rem 1.5rem}.welcome-content{text-align:center}.welcome-content h1{margin:0 0 .5rem;font-size:2rem;font-weight:300}.welcome-content p{margin:0;font-size:1.125rem}.command-result{width:min(42rem,100%);color:#f4f4f4}.command-result h1,.password-generator h1{margin:0 0 1rem;font-size:2rem;font-weight:300}.command-result p,.command-result li,.command-result dt,.command-result dd{font-size:1.25rem}.command-result dl{display:grid;grid-template-columns:max-content 1fr;gap:.75rem 1.5rem}.command-result dt{font-weight:600}.command-result dd{margin:0}.result-content{place-items:start center}.password-generator{box-sizing:border-box;width:min(46rem,100%);border:1px solid #d3d7db;border-radius:.6rem;padding:2rem;color:#23313d;background:#fafafa;box-shadow:0 .25rem .75rem #0003}.password-length{display:grid;gap:.5rem;width:min(14rem,100%);font-size:1.25rem;font-weight:600}.password-length input,.password-output input{box-sizing:border-box;min-height:2.5rem;border:1px solid #a9b0b6;border-radius:.25rem;padding:.5rem;color:inherit;background:#fff;font:inherit}.password-generator>input[type=range]{width:100%;accent-color:#0067d8}.password-format{margin:1.5rem 0;border:1px solid #a9b0b6;border-radius:.25rem;padding:1rem}.password-format-grid{display:grid;grid-template-columns:40% 60%}.format-selector,.format-options{display:grid;align-content:start;gap:.75rem}.format-selector{border-right:1px solid #d3d7db;padding-right:1rem}.format-options{padding-left:1rem}.format-options p{margin:.5rem 0 0}.password-generator input[type=checkbox],.password-generator input[type=radio]{accent-color:#0067d8}.generate-password{width:100%;min-height:3rem;border:0;border-radius:.25rem;background:#0067d8;color:#fff;font:inherit;font-size:1.25rem;cursor:pointer}.generate-password:disabled,.password-output button:disabled{cursor:not-allowed;opacity:.6}.password-output{display:grid;gap:.5rem;margin-top:1.5rem;font-size:1.25rem;font-weight:600}.password-output span{display:flex;gap:1rem}.password-output input{flex:1;min-width:0}.password-output button{width:7rem;border:0;border-radius:.25rem;background:#566879;color:#fff;font:inherit;cursor:pointer}.password-error{color:#b3261e;font-weight:600}.password-status{color:#235b2a}.site-footer{margin:0 18%;border-top:1px solid #506476;padding:2.5rem 0 .75rem}.site-footer p{margin:0;font-size:1.625rem;font-weight:300}@media(max-width:52rem){.site-header{flex-wrap:wrap}.site-logo{flex-basis:auto;padding:0 1.5rem}.site-search{flex:1}.site-search input{width:100%}.site-header nav{padding:0 1.5rem}}@media(max-width:36rem){.site-header nav{min-height:3rem}.site-footer{margin:0 1.5rem}.site-footer p{font-size:1.125rem}.password-generator{padding:1.25rem}.password-format-grid{grid-template-columns:1fr;gap:1rem}.format-selector{border-right:0;border-bottom:1px solid #d3d7db;padding:0 0 1rem}.format-options{padding-left:0}}