*,*:before,*:after{padding:0;margin:0;box-sizing:border-box}a{display:inline-block;width:fit-content;color:inherit;text-decoration:none}ul{list-style:none}button,label,input,textarea{display:inline-block;width:fit-content;background-color:inherit;color:inherit;font-family:inherit;font-size:inherit;font-weight:inherit;border:0;outline:0}textarea{resize:none}button{cursor:pointer}img{max-width:100%}p{line-height:1.4}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}:root{--text-color: #4a4e74;--main-bg: #0b2434;--selected-card: #59e391;--button-color: #5035ff;--light-gray: #f5f5f5;--white: #fff}html{font-size:16px}body{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}.main{display:flex;justify-content:center;align-items:center;min-height:100vh;background-color:var(--main-bg)}.main__container{display:flex;flex-direction:column;justify-content:center;align-items:center;width:min(90%,400px);margin:0 auto;padding:2.25rem 3rem;background-color:var(--light-gray);border-radius:10px;color:var(--text-color);font-size:1.25rem;text-align:center}.container__card-box{display:grid;grid-template-columns:repeat(5,minmax(40px,100px));gap:1rem .5rem;padding:1.75rem 0}.container__card-box .card{width:75%;height:50px;background-color:var(--white);font-size:2rem;font-weight:500;box-shadow:0 0 10px #00000040;border-radius:10px;cursor:pointer;transition:.15s}.container__card-box .card.selected{background-color:var(--selected-card)}.card button{cursor:inherit}.container__button{padding:.75rem 2rem;background-color:#5035ff;color:var(--white);border-radius:10px}.card.not-allowed{cursor:not-allowed}
