div.password-display-container{width:100%;padding:1rem 2rem;margin-bottom:2rem;border-radius:1rem;background-color:var(--clr-white);box-shadow:#00000029 0 3px 6px,#0000003b 0 3px 6px;display:flex;align-items:center}p.password-text{padding-right:.25rem;font-size:2rem;border-right:1px solid var(--clr-grey-100);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex-grow:1}p.password-text.hidden{text-overflow:unset}@media screen and (max-width: 450px){p.password-text{font-size:2.2rem}}span.number{color:var(--clr-blue-300)}span.special{color:var(--clr-red)}button.generate-button,button.copy-button,button.hide-button{margin-left:1rem;background-color:transparent;border-radius:50%;border:none;opacity:.3;display:flex;align-items:center;cursor:pointer;transition:all .2s;touch-action:manipulation}button.generate-button:hover,button.copy-button:hover,button.hide-button:hover{opacity:.8;transform:scale(1.1)}button.generate-button:active,button.copy-button:active,button.hide-button:active{opacity:1;transform:scale(.95)}@media (hover: none){button.generate-button:hover,button.copy-button:hover,button.hide-button:hover{opacity:.3;transform:none}}div.length-container{width:100%;padding:1rem 0;margin-bottom:2rem;border-bottom:1px solid var(--clr-grey-100);display:flex;align-items:center}@media screen and (max-width: 450px){div.length-container{padding-bottom:2rem;flex-direction:column;align-items:flex-start}label.length-label{display:none}}span.show-on-mobile{margin-bottom:1rem;display:none}@media screen and (max-width: 450px){span.show-on-mobile{display:block}}input.range-input{height:.5rem;margin-left:1rem;margin-right:1rem;border-radius:1rem;-webkit-appearance:none;-moz-appearance:none;appearance:none;flex-grow:1}@media screen and (max-width: 450px){input.range-input{height:1.25rem;width:100%;margin:0}}input.range-input::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:2rem;height:2rem;background-color:var(--clr-white);border:1px solid var(--clr-grey-100);border-radius:50%;transition:all .2s ease-in-out}input.range-input::-webkit-slider-thumb:hover,input.range-input::-webkit-slider-thumb:active{background-color:var(--clr-blue-200);border:none}@media screen and (max-width: 450px){input.range-input::-webkit-slider-thumb{width:3rem;height:3rem}}input.range-input::-moz-range-thumb{width:2rem;height:2rem;background-color:var(--clr-white);border:1px solid var(--clr-grey-100);border-radius:50%;transition:all .2s ease-in-out}input.range-input::-moz-range-thumb:hover,input.range-input::-moz-range-thumb:active{background-color:var(--clr-grey-200);border:none}@media screen and (max-width: 450px){input.range-input::-moz-range-thumb{width:3rem;height:3rem}}input.range-input::-ms-thumb{width:2rem;height:2rem;background-color:var(--clr-white);border:1px solid var(--clr-grey-100);border-radius:50%;transition:all .2s ease-in-out}input.range-input::-ms-thumb:hover,input.range-input::-ms-thumb:active{background-color:var(--clr-grey-200);border:none}@media screen and (max-width: 450px){input.range-input::-ms-thumb{width:3rem;height:3rem}}input.number-input{width:5rem;padding:.5rem;text-align:center;border:1px solid var(--clr-grey-100);border-radius:1rem;outline-color:var(--clr-blue-300);-moz-appearance:textfield;-webkit-appearance:textfield;appearance:textfield}input.number-input::-webkit-outer-spin-button,input.number-input::-webkit-inner-spin-button{-webkit-appearance:none}@media screen and (max-width: 450px){input.hide-on-mobile{display:none}}ul.options-list{margin-bottom:3rem}li.options-item{margin-bottom:1rem;display:flex;justify-content:space-between;align-items:center}@media screen and (max-width: 450px){li.options-item{font-size:1.8rem;margin-bottom:2rem}}input.option-input{position:relative;width:3.5rem;height:2rem;background-color:var(--clr-grey-100);border-radius:7rem;-webkit-appearance:none;-moz-appearance:none;appearance:none}@media screen and (max-width: 450px){input.option-input{width:4.5rem;height:2.5rem}}input.option-input:hover{background-color:var(--clr-grey-200)}@media (hover: none){input.option-input:hover{background-color:var(--clr-grey-100)}}input.option-input,input.option-input:after{transition:all .1s ease-out}input.option-input:after{position:absolute;content:"";width:1.4rem;height:1.4rem;top:.3rem;left:.3rem;background-color:var(--clr-white);border-radius:50%}@media screen and (max-width: 450px){input.option-input:after{width:1.85rem;height:1.85rem}}input.option-input:checked{background-color:var(--clr-blue-300)}input.option-input:checked:after{left:1.8rem}@media screen and (max-width: 450px){input.option-input:checked:after{left:2.3rem}}input.option-input:checked:hover{background-color:var(--clr-blue-400)}@media (hover: none){input.option-input:checked:hover{background-color:var(--clr-blue-300)}}input.option-input:checked:disabled{background-color:var(--clr-blue-100)}div.password-strength-container{width:100%;display:flex;flex-direction:column;align-items:end}div.password-strength-bar{margin-bottom:.5rem;display:flex}div.strength-bar-segment{width:4rem;height:.4rem;margin-right:.4rem;border-radius:1rem;background-color:var(--clr-grey-100)}div.strength-bar-segment:last-child{margin-right:0}@media screen and (max-width: 400px){div.strength-bar-segment{width:3rem;height:.3rem;margin-right:.3rem}}p.password-strength-text{font-weight:600}@media screen and (max-width: 400px){p.password-strength-text{font-size:1.4rem}}div.strength-bar-segment:nth-child(1).very-weak{background-color:var(--clr-red)}p.password-strength-text.very-weak{color:var(--clr-red)}div.strength-bar-segment:nth-child(1).weak,div.strength-bar-segment:nth-child(2).weak{background-color:var(--clr-orange)}p.password-strength-text.weak{color:var(--clr-orange)}div.strength-bar-segment:nth-child(1).moderate,div.strength-bar-segment:nth-child(2).moderate,div.strength-bar-segment:nth-child(3).moderate{background-color:var(--clr-yellow)}p.password-strength-text.moderate{color:var(--clr-yellow)}div.strength-bar-segment:nth-child(1).strong,div.strength-bar-segment:nth-child(2).strong,div.strength-bar-segment:nth-child(3).strong,div.strength-bar-segment:nth-child(4).strong{background-color:var(--clr-green-100)}p.password-strength-text.strong{color:var(--clr-green-100)}div.strength-bar-segment:nth-child(1).very-strong,div.strength-bar-segment:nth-child(2).very-strong,div.strength-bar-segment:nth-child(3).very-strong,div.strength-bar-segment:nth-child(4).very-strong,div.strength-bar-segment:nth-child(5).very-strong{background-color:var(--clr-green-200)}p.password-strength-text.very-strong{color:var(--clr-green-200)}main.main-container{max-width:45rem;width:100vw;padding:2rem;display:flex;flex-direction:column;justify-content:center;align-items:center}div.password-configuration-container{width:100%;margin-bottom:1rem;padding:1rem 2rem;border-radius:1rem;background-color:var(--clr-white);box-shadow:#00000029 0 3px 6px,#0000003b 0 3px 6px}div.copy-feedback-container{position:relative;width:100%;height:5rem;margin-bottom:1rem;text-align:center;font-size:1.4rem;font-weight:700;opacity:.7}p.copy-success-text,p.copy-error-text{position:absolute;width:100%;top:3.5rem;left:50%;transform:translate(-50%,-50%)}p.copy-success-text{color:var(--clr-blue-300)}p.copy-error-text{color:var(--clr-red)}:root{font-size:62.5%;--clr-white: #fff;--clr-grey-100: #e6e6e6;--clr-grey-200: #c9cbcd;--clr-blue-100: #e0f1fe;--clr-blue-200: #69aefd;--clr-blue-300: #0571ed;--clr-blue-400: #0451b3;--clr-red: #d90429;--clr-orange: #ff7f00;--clr-yellow: #f6d02f;--clr-green-100: #00b140;--clr-green-200: #005e2e}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}body,html{height:100%}body{font-weight:400;font-size:1.6rem;font-family:JetBrains Mono,monospace;background-color:var(--clr-white);display:flex;justify-content:center;align-items:center;overflow:hidden}li{list-style:none}