:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background:var(--page-background);background-attachment:fixed;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--input-background-color: #330156;--inout-font-color: #6e5e7a;--container-background-color: #140029;--page-background: linear-gradient(to bottom right, #440067, #12002e);--sidebar-background: linear-gradient(to bottom right, #20003c, #0e0225)}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;justify-content:center;align-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}div.application-container{height:100vh;width:100vw;display:flex;flex-direction:row}@media (max-width: 830px){div.application-container{flex-direction:column;align-items:center}}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}div.login-container{display:flex;padding:2.5em;flex-direction:column;align-items:center;gap:20px;background-color:var(--container-background-color);border-radius:20px;border:2px solid rgb(125,64,158)}div.login-input-container{display:flex;flex-direction:column;gap:5px}div.login-input-container>label{font-size:1em;font-weight:500}div.login-input-container>input{background-color:var(--input-background-color);outline:1px solid rgb(125,64,158);border:3px solid transparent;border-radius:8px;padding:.6em;transition:border .1s}div.login-input-container>input:focus{outline:none;border:3px solid rgb(125,64,158);box-sizing:border-box}button.login{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;margin-top:10px;font-size:1em;font-weight:500;font-family:inherit;background-color:#3a0b63;cursor:pointer;transition:border-color .25s}button.login:hover{border-color:#fff;background-color:#4f1581}button.login:active{transform:scale(.98)}p.login-error{margin:0;color:#fd2525;font-size:.8em}h2.login{margin:0;font-size:2.5em;color:#fff}div.sidebar-container{flex:1;background:var(--sidebar-background);padding:2em 1em}h2.sidebar{margin:0 0 .5em;font-size:2.75em;color:#fff;text-align:center;font-weight:500}div.sidebar-item{display:flex;flex-direction:row;gap:5px;align-items:center;margin-top:.75em;cursor:pointer;background-color:none;border-radius:10px;padding-left:.5em;min-height:2.75em;transition:background-color .25s,transform .25s}div.sidebar-item.active{background-color:#3f0c6c}div.sidebar-item:hover{background-color:#3a0b63;transform:scale(1.02)}div.sidebar-item>img{height:1.5em}div.sidebar-item>h3{font-size:1.5em;font-weight:500;margin:0}@media (max-width: 830px){div.sidebar-container{width:90vw;padding-left:5vw;padding-right:5vw;justify-items:center}div.sidebar-item{width:100%;max-width:300px}}div.dashboard-container{flex:6;padding:2em 4em}@media (max-width: 830px){div.dashboard-container{padding:1em 2em;width:85vw;align-items:center}}h1.online-time-frame-title{margin:0 0 .7em}@media (max-width: 830px){h1.online-time-frame-title{text-align:center}}div.user-online-time-container{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1.5em}div.user-online-time-item{background-color:var(--container-background-color);border-radius:15px;padding:1em;min-height:10em;max-width:17em}h2.user-online-time-title{margin:0 0 1em;font-size:1.75em;font-weight:300}h2.user-online-time{margin:0;font-weight:500;font-size:2.5em}@media (max-width: 830px){div.user-online-time-container{justify-items:center}div.user-online-time-item{width:calc(100% - 2em)}}div.online-time-ranking-container{margin-top:2em;display:flex;flex-direction:row;justify-content:space-between}div.online-time-ranking-item{background-color:var(--container-background-color);border-radius:15px;padding:1em;min-height:10em;flex-grow:1;max-width:17em;min-width:12em;height:55vh;overflow-y:scroll}h2.online-time-ranking-title{margin:0 0 .5em;font-size:1.75em;font-weight:300}h2.online-time-ranking-user-item{font-weight:400;font-size:1.25em;margin:.25em 0 0}@media (max-width: 830px){div.online-time-ranking-container{flex-direction:column}div.online-time-ranking-item{margin-bottom:1.5em}}h1.music-frame-title{margin:0 0 .7em}@media (max-width: 830px){h1.music-frame-title{text-align:center}}div.user-songs-container{max-height:85vh;overflow-y:scroll}div.user-song-item{display:flex;flex-direction:row;justify-content:space-between;gap:5px;align-items:center;margin-bottom:1.5em;padding:1em;border-radius:15px;background-color:var(--container-background-color)}h2.user-song-item-name{margin:0;font-size:1.5em;font-weight:500;width:60%}h2.user-song-item-times-played{margin:0;font-size:1.25em;width:15%}h2.user-song-item-last-play-date{margin:0;font-size:1.25em;width:10%}button.user-song-item-remove{background-color:red;font-size:1em;border:none;border-radius:5px;padding:.5em 1em;color:#fff;cursor:pointer;transition:transform .25s}button.user-song-item-remove:hover{background-color:#ff1313;transform:scale(1.02)}@media (max-width: 830px){div.user-song-item{flex-direction:column;align-items:start;gap:2em}div.user-songs-container{max-height:none;overflow-y:hidden}}