*{box-sizing:border-box;scrollbar-width:thin;scrollbar-color:#bfa28c #dbd0bb}::-webkit-scrollbar{width:12px;height:12px}::-webkit-scrollbar-track{background:#dbd0bb;border-radius:10px;margin:8px}::-webkit-scrollbar-thumb{background:#bfa28c;border:3px solid #dbd0bb;border-radius:10px}::-webkit-scrollbar-thumb:hover{background:#9d8370}html{flex-direction:row;justify-content:center;align-items:flex-start;width:100%;height:100%;display:flex}body{background-color:#cab9a7;width:100%;height:100%;margin:0;padding:0;font-family:Arial,Helvetica,sans-serif;overflow-x:hidden}#nav{background-color:#dbd0bb;flex-direction:row;justify-content:space-between;align-items:center;width:100%;height:20%;display:flex}#title{margin-right:50px;font-size:40px;font-weight:700}#nav img{width:150px;height:150px}#main{flex-direction:row;width:100%;height:80%;display:flex}#left-container,#right-container{flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;display:flex}#chart-box{background-color:#bfa28c;border-radius:10px;flex-direction:column;justify-content:flex-start;align-items:center;width:500px;height:500px;display:flex}#new-user{flex-direction:column;gap:10px;display:flex}#new-user input{border:none;border-radius:5px;height:40px;padding:10px;font-size:20px}#submit{cursor:pointer;background-color:#dbd0bb}#submit:hover{color:#f2ebe0;background-color:#c59169;animation-delay:30ms}#search-container{background-color:#bfa28c;border-radius:10px;flex-direction:column;justify-content:flex-start;align-items:center;width:600px;height:500px;display:flex}#chart-box h2,#search-container h2{font-size:35px}#leaderboard{flex-direction:column;justify-content:flex-start;align-items:center;width:550px;height:250px;display:flex;overflow-y:scroll}#leaderboard table{text-align:center;width:100%;font-size:20px}#rank-details-box{flex-direction:column;justify-content:center;align-items:center;display:flex}#rank-details-box p{text-align:center}#icon-box{flex-direction:row;justify-content:center;align-items:center;gap:50px;display:flex}#table th,td{padding:5px;overflow:visible}table,thead,tbody,tr{overflow:visible}#table th{z-index:1;background-color:#bfa28c;position:sticky;top:0}.action-plus,.action-minus{border:hidden;border-radius:10px;flex-direction:row;justify-content:center;align-items:center;width:30px;height:30px;display:flex}.action-plus span,.action-minus span{cursor:pointer;flex-direction:row;justify-content:center;align-items:center;display:flex}#action{flex-direction:row;justify-content:center;align-items:center;gap:10px;display:flex}#filter{border:none;border-radius:5px;width:230px;height:40px;margin-bottom:15px;padding:10px;font-size:20px}#table-body .hide{display:none}@media (width<=1000px){#nav{background-color:#dbd0bb;flex-direction:column;justify-content:center;align-items:center;width:100%;padding:10px 0;display:flex}#title{text-align:center;margin:0}#main{flex-direction:column;justify-content:center;align-items:center;gap:10px;padding-top:10px;display:flex}#left-container{flex-direction:column;justify-content:center;align-items:center;width:100%;height:230px;display:flex}#chart-box{background-color:#bfa28c;border-radius:10px;flex-direction:column;justify-content:flex-start;align-items:center;width:350px;height:215px;margin-bottom:0;padding-top:15px;display:flex}#icon-box{flex-direction:row;justify-content:center;align-items:center;padding-top:8px;display:flex}#new-user input{border:none;border-radius:5px;width:200px;height:30px;padding:10px;font-size:15px}#right-container{flex-direction:column;justify-content:center;align-items:center;width:100%;height:auto;display:flex}#search-container{background-color:#bfa28c;border-radius:10px;flex-direction:column;justify-content:flex-start;align-items:center;width:350px;height:270px;display:flex}#leaderboard{flex-direction:column;justify-content:flex-start;align-items:center;width:310px;height:250px;margin-bottom:15px;display:flex;overflow:auto scroll}.action-plus,.action-minus{border:hidden;border-radius:5px;flex-direction:row;justify-content:center;align-items:center;width:30px;height:30px;display:flex}.action-plus span,.action-minus span{flex-direction:row;justify-content:center;align-items:center;font-size:15px;display:flex}#leaderboard table{text-align:center;width:100%;margin-top:20px;font-size:14px}#table th,td{padding:3px}#title{font-size:23px;font-weight:700}#nav img{width:100px;height:100px}#chart-box h2{margin:0 0 15px;font-size:20px}#search-container h2{padding:3px;font-size:20px}#filter{width:180px;height:20px;font-size:15px}}
