@import"https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@700&display=swap";html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:"";content:none}table{border-collapse:collapse;border-spacing:0}input{outline:none}button{border:none}body{font-family:JetBrains Mono,monospace}.heading-l{font-family:JetBrains Mono;font-size:32px;font-style:normal;font-weight:700;line-height:normal;font-feature-settings:"clig" off,"liga" off;color:#e6e5ea}.heading-m{font-family:JetBrains Mono;font-size:24px;font-style:normal;font-weight:700;line-height:normal;font-feature-settings:"clig" off,"liga" off;color:#e6e5ea}.body{font-family:JetBrains Mono;font-size:18px;font-style:normal;font-weight:700;line-height:normal;font-feature-settings:"clig" off,"liga" off;color:#e6e5ea}html,body{width:100%;height:100%}body{display:flex;align-items:center;justify-content:center;background:linear-gradient(180deg,#14131b 0%,#08070b 100%);color:#e6e5ea}.btn-primary{width:100%;margin-top:32px;height:65px;cursor:pointer;color:#24232c;font-size:18px;background-color:#a4ffaf;display:flex;align-items:center;justify-content:center;gap:8px}.btn-primary:hover{background-color:transparent;color:#a4ffaf;border:2px solid #A4FFAF}.container{display:flex;flex-direction:column;align-items:center;width:540px}.container h1{color:#817d92;margin-bottom:32px}.container .show-input{width:100%;position:relative;margin-bottom:24px;background-color:#24232c}.container .show-input input{width:calc(100% - 96px);padding:19px 64px 19px 32px;height:100%;background-color:transparent;border:none;color:#e6e5ea;font-size:32px}.container .show-input button{position:absolute;background-color:transparent;right:28px;top:50%;transform:translateY(-50%);cursor:pointer}.container .show-input button img{width:100%;display:block}.container form{width:calc(100% - 64px);padding:24px 32px;background-color:#24232c}.container form .form-control label{font-size:18px}.container form .form-control input[type=range]{width:100%;height:8px;accent-color:#A4FFAF;cursor:pointer}.container form .form-control:not(:last-child){margin-bottom:20px}.container form .form-control:not(:first-child) label{display:flex;align-items:center;gap:24px}.container form .form-control .label-data{display:flex;justify-content:space-between;align-items:center}.container form .form-control .label-data .length{font-size:18px;font-weight:700;color:#e6e5ea}.container form .form-control .label-data .length-number{font-size:32px;color:#a4ffaf}.container form .show-strength{background-color:#18171f;padding:25px 32px;display:flex;justify-content:space-between;align-items:center}.container form .show-strength .strength-level{font-size:18px;color:#817d92}.container form .show-strength .strength-container{display:flex;align-items:center;gap:8px}.container form .show-strength .strength-container h5{margin-right:16px;font-size:24px}.container form .show-strength .strength-container .strength{width:10px;height:28px;border:1px solid white;background-color:transparent}.container form .show-strength .strength-container .strength.active-1,.container form .show-strength .strength-container .strength.active-1.active-2,.container form .show-strength .strength-container .strength.active-1.active-2.active-3,.container form .show-strength .strength-container .strength.active-1.active-2.active-3.active-4{background-color:#a4ffaf}.container form .show-strength .strength-container .strength.active-1,.container form .show-strength .strength-container .strength.active-1.active-2,.container form .show-strength .strength-container .strength.active-1.active-2.active-3{background-color:#f8cd65}.container form .show-strength .strength-container .strength.active-1,.container form .show-strength .strength-container .strength.active-1.active-2{background-color:#fb7c58}.container form .show-strength .strength-container .strength.active-1{background-color:#f64a4a}@media (max-width: 478px){.container{width:310px;margin:10px}.container h1{font-size:16px}.container .show-input input{padding:19px 12px}.container form{width:calc(100% - 32px);padding:21px 16px}.container form .form-control label{font-size:16px}.container form .form-control:not(:first-child) label{gap:15px}.container form .show-strength{padding:17px}.container form .show-strength .strength-level{font-size:16px}.container form .show-strength .strength-container h5{font-size:18px}}