*{font-family:JetBrains Mono,sans-serif;font-size:12px;margin:0;padding:0;color:#e8e7ef}html{height:100%;width:100%;background-image:linear-gradient(#15141c,#09080c);background-color:#15141c;display:flex;justify-content:center;align-items:center}body{height:100%;width:400px;align-content:center}#generate{background-color:#a4ffab;color:#000;font-weight:700;width:100%;height:50px;padding:10px 0;border:none;display:flex;align-items:center;justify-content:center;gap:10px;cursor:pointer}#generate img{width:12px;height:12px;filter:brightness(0) saturate(100%)}#generate:hover{border:2px solid rgb(164 255 171);background:transparent;color:#a4ffab}#generate:hover .arrow-right{fill:#a4ffab}.container-password{background-color:#24232b;width:100%;height:60px;display:flex;align-items:center;justify-content:space-between;padding:20px;box-sizing:border-box;margin-top:20px;margin-bottom:20px}.container-password p{font-size:20px;color:#55545d}.active{color:#fff!important}.error{color:#ce4b4b!important;font-size:16px!important}#copy{border:none;background-color:transparent;cursor:pointer}.container-password svg{place-self:center;padding:5px}.container-password svg:hover path{fill:#fff}input[type=checkbox]{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:transparent;border:2px solid rgb(232,231,239);border-radius:0%;width:16px;height:16px;top:4px;cursor:pointer;position:relative;margin-right:8px}input[type=checkbox]:hover{border-color:#a4ffab}input[type=checkbox]:checked{background-color:#a4ffab;border:none;position:relative}input[type=checkbox]:checked:after{content:"";position:absolute;top:60%;left:50%;width:12px;height:12px;background-image:url("data:image/svg+xml,%3csvg%20width='14'%20height='12'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20stroke='%2318171F'%20stroke-width='3'%20fill='none'%20d='M1%205.607%204.393%209l8-8'/%3e%3c/svg%3e");background-size:contain;background-repeat:no-repeat;transform:translate(-50%,-50%)}.character-container{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center}label{flex:50%;font-size:1.1rem}.character-container p{flex:50%;font-size:20px;text-align:end;color:#a4ffab}input[type=range]{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;height:6px;background:#181818;outline:none;overflow:visible;position:relative;margin:12px 0;background-image:linear-gradient(#a4ffab,#a4ffab);background-size:calc((100% - 18px) * var(--ratio)) 100%;background-repeat:no-repeat}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:25px;height:25px;background:#fff;border-radius:50%;cursor:pointer;position:relative;z-index:2}input[type=range]::-moz-range-thumb{width:25px;height:25px;background:#fff;border-radius:50%;cursor:pointer;border:none}input[type=range]::-webkit-slider-thumb:hover{border:2px solid rgb(164 255 171);background:#000}input[type=range]::-moz-range-thumb:hover{border:2px solid rgb(164 255 171);background:#000}.container{max-width:500px;margin:0 auto}.options{display:flex;flex-direction:column;box-sizing:border-box;width:100%;padding:25px;background-color:#24232b;gap:25px}h1{text-align:center;font-size:20px;color:#55545d}.checkbox-container{display:flex;flex-direction:column;gap:15px}@media screen and (max-width: 480px){.app{transform:scale(.9);transform-origin:top center}}.container-strength{display:flex;align-items:center;justify-content:space-between;box-sizing:border-box;width:100%;height:50px;background-color:#18171f;padding:20px}.container-strength h2{color:#55545d}.container-strength h1{font-size:15px;color:#fff;place-self:center}#strength-data{display:flex;flex-direction:row;gap:8px}.blocks{display:flex;flex-direction:row;align-items:center;gap:6px}.blocks div{display:flex;flex-direction:row;gap:5px;box-sizing:border-box;height:25px;width:7px;border:1.5px solid white;background-color:transparent;transition:all .3s ease}.blocks .easy{border:red;background-color:red}.blocks .medium{border:yellow;background-color:#ff0}.blocks .hard{border:green;background-color:green}