body{background-color:#252525;color:#d3d3d3}.container{margin:2rem auto;padding:2rem;background:radial-gradient(#1a1a1a,#1b1b1b);border-radius:16px;box-shadow:0 2px 8px #000c}h1{text-align:center;text-transform:uppercase;text-shadow:0 0 4px rgba(35,34,34,.4);font-size:2rem;margin:0}@media screen and (min-width: 1025px){.container{width:60%}.h1{font-size:3.5rem}}.password-display{display:flex;justify-content:center;align-items:center;min-height:8rem;max-height:10rem;padding:0 2rem}.password-display button{background:#2a2a3a;color:#fff;border:none;padding:.8rem;border-radius:8px;outline:none;font-size:1rem;width:100%;text-align:center;display:flex;align-items:center;justify-content:space-between;cursor:pointer;transition:all .3s ease-in-out}.password-display button:focus{border:2px solid #4e9eff}.password-display button:hover{background:#377fd1}.password-display button svg{fill:#fff;width:20px;height:20px}.password-display span.password{height:1rem;overflow:hidden;max-width:calc(100% - 28px);white-space:normal;flex-grow:1}@media (min-width: 768px){.password-display span.password{word-wrap:break-word}.password-display span.password{height:auto}}.password-form{font-size:1.2rem}.checkbox-container{display:flex;justify-content:center;flex-wrap:wrap}input[type=range]{width:100%;background:#4e9eff}input[type=range]:hover{background:#377fd1}input[type=checkbox]{transform:scale(1.2);accent-color:#4e9eff}.password-input-container{font-size:1rem}@media screen and (min-width: 725){.password-input-container{font-size:1.4rem}}.password-input-container label{margin-right:1rem}.checkbox-container label{color:#ccc;margin:0 .2rem;transition:color .3s ease}input[type=checkbox]:disabled{opacity:.6;cursor:not-allowed}