.achievements{position:absolute;inset:auto auto auto 0;z-index:5;width:100vw;height:100vh;background-color:#222429;text-align:center;-webkit-transition:0.5s;transition:0.5s;overflow:hidden}.achievements h2{margin:1rem auto 0.5rem auto;padding:0.5rem;margin:0;font-family:"Grenze Gotisch",cursive;font-size:3.5rem;letter-spacing:0.1rem}.achievements .close{position:absolute;inset:1rem 1.5rem auto auto;z-index:auto;background:none;border:none;font-family:"Courier New",Courier,monospace;color:white;font-size:2.75rem;font-weight:bold;cursor:pointer}.achievements .close:hover{color:rgb(255,213,0)}.achievements{bottom:100vh}.achievements-list,.credits-list{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-ms-flex-wrap:wrap;flex-wrap:wrap;gap:4rem 2rem;max-height:calc(100% - 11rem);max-width:100%;padding-top:3.5rem;margin:1rem;border-top:1px solid whitesmoke;text-align:left;overflow-y:scroll;overflow-x:hidden}.achievements-list::-webkit-scrollbar,.credits-list::-webkit-scrollbar{display:initial;width:0.7rem}.achievements-list::-webkit-scrollbar-thumb,.credits-list::-webkit-scrollbar-thumb{background-color:darkgrey;border-radius:3rem}.achievement{position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;min-width:16rem;width:35rem;max-width:90%;padding:1.5rem;padding-top:8rem;border:1px solid #444444}.achievement h3{font-family:"Grenze Gotisch",cursive;margin:0;margin-top:-0.5rem;font-size:1.125rem}.achievement.bronze{border:1px solid #9b6217}.achievement.bronze .star.bronze .bg1,.achievement.bronze .star.bronze .bg2:after{border-color:#9b6217}.achievement.bronze .star.bronze img{-webkit-filter:none!important;filter:none!important}.achievement.bronze .progress div{background-color:#979797}.achievement.silver{border:1px solid #979797}.achievement.silver .star.silver .bg1,.achievement.silver .star.silver .bg2:after{border-color:#979797}.achievement.silver .star.silver img{-webkit-filter:none!important;filter:none!important}.achievement.silver .progress div{background-color:#ffd500}.achievement.gold{border:1px solid #ffd500}.achievement.gold .star.gold .bg1,.achievement.gold .star.gold .bg2:after{border-color:#ffd500}.achievement.gold .star.gold img{-webkit-filter:none!important;filter:none!important}.achievement .banner{position:absolute;inset:-1.5rem auto auto auto;z-index:auto;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;width:100%}.achievement .banner>img{position:relative;inset:auto auto auto auto;z-index:1;height:2.5rem;aspect-ratio:1500/120;min-width:15rem}.achievement .banner span{position:absolute;inset:0 auto auto auto;z-index:2;font-family:"Grenze Gotisch",cursive;font-size:1.25rem;font-weight:bold}.achievement .banner .stars{position:relative;inset:-0.5rem auto auto auto;z-index:auto;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;gap:2rem}.achievement .banner .star{position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.achievement .banner .star.bronze,.achievement .banner .star.silver{height:2.5rem;margin-top:-1.5rem}.achievement .banner .star.gold{height:4rem}.achievement .banner .star img{position:absolute;height:2.5rem;aspect-ratio:1;margin-top:0.7rem;-webkit-filter:brightness(0) invert(12%) sepia(3%) saturate(2188%) hue-rotate(185deg) brightness(99%) contrast(95%);filter:brightness(0) invert(12%) sepia(3%) saturate(2188%) hue-rotate(185deg) brightness(99%) contrast(95%)}.achievement .banner .star .bg1{position:relative;width:3rem;height:101%;border-left:1px solid #222429;border-right:1px solid #222429;background-color:#444444}.achievement .banner .star .bg1:after{content:"";position:absolute;inset:0 calc(-0.5rem + 0.5px) auto auto;z-index:-1;width:4rem;height:calc(100% + 0.275rem);background-color:#444444}.achievement .banner .star .bg2{position:absolute;inset:auto auto -1.7rem 0.125rem;z-index:-1;width:2.81rem;height:2.81rem;background-color:#444444;rotate:45deg}.achievement .banner .star .bg2:after{content:"";position:absolute;inset:auto 0.5rem 0.5rem auto;z-index:auto;width:2.13rem;height:2.13rem;border-bottom:1px solid #222429;border-right:1px solid #222429;background-color:#444444}.progress{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;border-radius:1rem;background-color:#4a4a4a;width:100%;height:0.5rem;margin-top:1rem;overflow:hidden}.progress div{width:0;height:100%;border-radius:1rem;background-color:#9b6217}