:root{--outer-space:#313538;--shark:#1d1e1f;--shuttle-gray:#586066;--turquoise:#2cc9b6;--wood-smoke:#0f0f10}*{box-sizing:border-box;margin:0;padding:0}body{align-items:center;background-color:var(--wood-smoke);display:flex;flex-direction:column;justify-content:center;min-height:100vh;font-family:Roboto Mono,monospace}main{margin:0 auto;max-width:800px;padding:0 24px;text-align:center;width:100%}.intro__logo{margin-bottom:32px}.intro__header{color:#fff;font-size:48px;font-weight:600;margin-bottom:16px}.intro__call,.intro__header{font-family:Poppins,sans-serif}.intro__call{color:#6e767c;font-size:20px;font-weight:400;margin-bottom:48px;padding:0 10%;text-align:center}.password-controls{display:flex;justify-content:center;margin-bottom:48px}.password-container{margin-bottom:64px}.password{display:inline-grid;gap:12px;grid-template-columns:repeat(8,56px);grid-template-rows:repeat(2,72px);justify-items:center}.password__row{color:#000;font-size:22px;font-weight:600}.password__char{align-items:center;background-color:#212224;border-radius:8px;color:#414549;display:flex;height:100%;font-family:Roboto Mono,monospace;font-size:36px;font-variant-numeric:tabular-nums;font-weight:500;justify-content:center;text-align:center;transition:background-color .35s ease,color .35s ease;width:100%}.password__char.password__char--g{background-color:rgba(44,201,182,.1);color:#218d80}.switcher{background-color:hsla(0,0%,46.3%,.1);border-radius:23px;cursor:pointer;height:46px;padding:0 21px 0 45px;position:relative}.switcher:not(:last-child){margin-right:16px}.switcher--checked{background-color:rgba(44,201,182,.1);border-color:var(--turquoise)}.switcher__checkbox{opacity:0;position:absolute}.switcher__checkbox:checked~.switcher__label{color:var(--turquoise);transform:translate(-23px)}.switcher__checkbox:checked~.switcher__tick--unchecked{opacity:0;transform:translate(20px,-50%)}.switcher__checkbox:checked~.switcher__tick--checked{opacity:1;transform:translateY(-50%)}.switcher__label{color:var(--shuttle-gray);display:inline-block;font-family:Poppins,sans-serif;font-size:16px;font-weight:400;line-height:46px;transition:transform .25s ease;user-select:none}.switcher__tick{font-size:0;position:absolute;top:50%;transform:translateY(-50%);transition:opacity .25s ease,transform .35s ease}.switcher__tick--unchecked{left:13px}.switcher__tick--checked{opacity:0;right:13px;transform:translate(-20px,-50%)}.action-buttons{margin:0 auto;position:relative;width:fit-content}.generate-password{background-color:#363b41;border:none;border-radius:28px;color:#7f8990;cursor:pointer;font-family:Poppins,sans-serif;font-size:18px;font-weight:500;height:56px;outline:none;padding:0 32px;position:relative;transition:opacity .45s ease}.generate-password:disabled,.repeat-password-generation:disabled{cursor:not-allowed;opacity:.25}.generate-password--clipboard{background-color:rgba(44,201,182,.2);color:#2cc9b6;padding:0 72px 0 32px}.generate-password--clipboard+.repeat-password-generation{display:inline-flex}.repeat-password-generation{background-color:transparent;border:none;cursor:copy;display:none;outline:none;position:absolute;right:8px;top:50%;transform:translateY(-50%);transition:opacity .45s ease}@media screen and (max-width:650px){.intro__logo{margin-bottom:24px;padding-top:64px}.intro__logo svg{height:36px;width:36px}.intro__header{font-size:36px;line-height:117%;margin:0 auto 16px;max-width:275px;width:100%}.intro__call{font-size:16px;margin:0 auto 40px;max-width:420px;padding:0 5%;width:100%}.password-controls{display:grid;gap:16px;grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(2,auto);margin:0 auto 48px;max-width:420px;width:100%}.switcher{text-align:left}.switcher:not(:last-child){margin-right:0}.switcher__checkbox:checked~.switcher__label{transform:translate(-23px)}.password{grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(4,72px);max-width:300px;width:100%}.action-buttons{margin-bottom:24px}}@media screen and (max-width:400px){.password-controls{gap:10px;grid-template-columns:1fr;grid-template-rows:repeat(4,auto)}}
/*# sourceMappingURL=main.ab8b49a58934ca41d5f6.css.map*/