*{box-sizing:border-box}body{margin:0}#root{margin:50px auto;padding:30px;width:300px;min-height:300px;font-family:Inter,sans-serif;border:1px solid #000}h1{margin:0 0 30px;font-size:24px;font-weight:400;letter-spacing:.03em}p{margin:0}.form{margin-bottom:30px;width:100%;display:flex;gap:10px}.form__input{padding:5px;width:70%;display:block;font-size:14px}.form__submit{display:block}.results{position:relative}.results__names{margin-bottom:20px;display:flex;gap:10px;font-size:20px}.results__container{margin:0 auto;width:fit-content;display:flex;align-items:center;gap:30px}.results__img{display:block;position:absolute;top:-20px;right:-20px;z-index:-1}.results__max,.results__min{width:75px;height:70px;display:flex;flex-direction:column;justify-content:center;align-items:center;border:1px solid #aaa}.over40{background-color:#8c2f24;color:#fff}.over35{background-color:#b5482e;color:#fff}.over30{background-color:#d8653c}.over25{background-color:#e38b3c}.over20{background-color:#f3b562}.over15{background-color:#f5d7a1}.over10{background-color:#c6cbd2}.over5{background-color:#a2acb5}.over0{background-color:#88939d;color:#fff}.over-5{background-color:#6e7a86;color:#fff}.over-10{background-color:#545f6b;color:#fff}.under-11{background-color:#3b444c;color:#fff}.how{margin:0 auto;padding:0 10px;width:fit-content;letter-spacing:.02em}.how__ttl{font-size:20px;font-weight:400}.how__span{font-weight:600}