.container{display:flex;align-items:center;justify-content:space-between;width:100%;height:60px;margin:0;background-color:#2c2c3899;color:#6cf}.navbar-container{display:flex;gap:20px}.navbar-element{font-size:30px;margin:0;cursor:pointer}.navbar-element:hover{text-decoration:underline}#title{position:absolute;font-size:50px;left:50%;transform:translate(-50%);white-space:nowrap}.avatar-container{display:flex;align-items:center;position:relative;height:100%;cursor:pointer}#useravatar img{height:60px;aspect-ratio:1 / 1;object-fit:cover;border-radius:50%;position:relative}.dropdown-menu{display:flex;position:absolute;top:100%;right:10px;background-color:#383844;width:100%;flex-direction:column;padding:5px}.dropdown-menu a{color:orange;text-decoration:none;padding:10px;font-size:16px;text-align:center}.dropdown-menu a:hover{text-decoration:underline}:root{padding:0;font-family:Arial,Helvetica,sans-serif}body{background-color:#17171c;margin:0;overflow:hidden}h1{font-size:3em;margin:0}h2{font-size:2em;margin:0}.tab-container{scroll-snap-type:y mandatory;overflow-y:scroll;height:100vh}.tab-container .tab{background-color:#17171c;grid-template-columns:25% 25% 25% 1fr;grid-template-rows:repeat(12,1fr);gap:20px;scroll-snap-align:start;height:calc(100vh - 100px);padding:20px;display:grid}.tab-container .tab .element{padding:10px;background-color:#2e2e38;border-radius:15px;box-shadow:0 0 10px #00000080;grid-column:span 2}.tab-container .tab:nth-child(1) #profile-container{display:block;position:relative;grid-row:1/span 5;text-shadow:#000 2px 2px 5px}.tab-container .tab:nth-child(1) #profile-container .user-banner{color:#a8b2d1;display:flex;width:100%;height:20%;align-items:center;justify-content:center;margin:0;border-bottom:1px solid black;text-shadow:0 0 15px rgba(168,178,209,.5)}.tab-container .tab:nth-child(1) #profile-container #stats-container{display:flex;height:calc(80% - 10px);padding-top:10px;color:#a8b2d1}.tab-container .tab:nth-child(1) #profile-container #stats-container #team-container{display:flex;flex-direction:column;align-items:center;height:100%;width:auto;max-width:15%;min-width:105px}.tab-container .tab:nth-child(1) #profile-container #stats-container #team-container #profile-picture{width:auto;max-width:100%;max-height:60%;aspect-ratio:1/1;height:auto;display:block}.tab-container .tab:nth-child(1) #profile-container #stats-container #team-container #team-banner{margin-top:10px;max-width:60%;max-height:20%;width:auto;aspect-ratio:2/1}.tab-container .tab:nth-child(1) #profile-container #stats-container #team-container #team-name{margin:0}.tab-container .tab:nth-child(1) #profile-container #stats-container #rank-container{display:flex;flex-direction:column;height:50%;margin-left:10px}.tab-container .tab:nth-child(1) #profile-container #stats-container #rank-container #site-rank{margin:5px 0 0}.tab-container .tab:nth-child(1) #profile-container #stats-container #rank-container #site-country-rank{margin:0}.tab-container .tab:nth-child(1) #profile-container #stats-container #rank-container #country-flag{position:relative;vertical-align:top;width:64px;height:36px;aspect-ratio:16/9}.tab-container .tab:nth-child(1) #profile-container #rank-container>img{box-shadow:#000 2px 2px 5px}.tab-container .tab:nth-child(1) #profile-container #team-container>img{box-shadow:#000 2px 2px 5px}.tab-container .tab:nth-child(1) #banner-gen-container{grid-row:6/span 7}.tab-container .tab:nth-child(1) #rank-graph{grid-row:1/span 4}.tab-container .tab:nth-child(1) #pp-graph{grid-row:5/span 4}.tab-container .tab:nth-child(1) #playcount-graph{grid-row:9/span 4}.tab-container .tab:nth-child(2) #top-play-filter{text-align:center;grid-column:1/span 1;grid-row:1/span 12;color:#a8b2d1}.tab-container .tab:nth-child(2) #top-play-container{display:flex;flex-direction:row;grid-column:2/span 3;grid-row:1/span 12;color:#a8b2d1;overflow-y:auto;overflow-x:hidden}.tab-container .tab:nth-child(2) .mode-container{text-align:center;width:25%;height:100%}.tab-container .tab:nth-child(2) .score-hover-wrapper{position:relative}.tab-container .tab:nth-child(2) .score-hover-overlay{position:absolute;top:0;left:0;width:calc(100% - 10px);height:100%;color:#fff;background-color:#000;display:flex;opacity:0;z-index:2;pointer-events:none;border-radius:15px}.tab-container .tab:nth-child(2) .score-hover-wrapper:hover .score-hover-overlay{opacity:1;pointer-events:auto}.tab-container .tab:nth-child(2) .score-container{display:flex;flex-direction:row;width:calc(100% - 10px);height:75px;border-radius:15px;background-color:#393a46;box-shadow:#000 3px 3px 1px;background-size:cover;margin-top:10px}.tab-container .tab:nth-child(2) .score-container strong{color:#a8b2d1;font-size:1.2em}.tab-container .tab:nth-child(2) .score-container .score-info{width:80%;height:100%;display:block;padding-left:30px;padding-top:5px}.tab-container .tab:nth-child(2) .score-container .score-info *{margin:0}.tab-container .tab:nth-child(2) .score-container .score-info .score-version{color:orange}.tab-container .tab:nth-child(2) .score-container .pp-info{width:20%;height:100%;justify-content:center;align-items:center;display:flex}.tab-container .tab:last-child{height:calc(100vh - 30px)}@media (max-width: 1100px) or (max-height: 600px){.tab-container{scroll-snap-type:none}.tab-container .tab{flex-direction:column;height:auto;min-height:calc(100vh - 100px);display:flex}.tab-container .tab #profile-container{height:341px}.tab-container .tab #banner-gen-container{height:486px}.tab-container .tab #rank-graph,.tab-container .tab #pp-graph,.tab-container .tab #playcount-graph{height:269px}.tab-container .tab #top-play-filter,.tab-container .tab #top-play-container{height:847px}}
