@import"https://fonts.googleapis.com/css2?family=Rubik+Scribble&display=swap";@import"https://fonts.googleapis.com/css2?family=Roboto+Mono:wght@100&display=swap";@import"https://fonts.googleapis.com/css2?family=Source+Code+Pro&display=swap";:root{color-scheme:light dark;color:#ffffffde;background-color:#18181b;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}html,.body{box-sizing:border-box;padding:0;margin:0;font-family:Roboto Mono,monospace}.main{display:flex;flex-direction:column;align-items:center;padding:0;margin:0;box-sizing:border-box}.web-title{font-family:Rubik Scribble;font-size:50px}.input-container{display:flex;flex-direction:row;padding:1rem;background-color:#37393e;border-radius:10px;gap:1rem}.username-input{background-color:#202225;color:#fff;border-radius:10px;border:none;height:2rem;width:16rem;padding:.5rem;font-size:15px}.generate-output{background-color:#5865f2;color:#fff;border-radius:10px;border:none;height:auto;width:auto;padding:.5rem;font-weight:700;cursor:pointer;transition:.1s}.generate-output:hover{background-color:#4750e5}.malCard{position:relative;padding-top:3.5rem}.malCard-container{position:relative;background:#222;height:200px;width:400px;border-radius:20px;box-shadow:0 4px 8px #a1a1aa30;transition:height .5s}.malCard-container:hover{height:500px}.profile-img{position:absolute;height:150px;width:150px;left:50%;top:-30px;transform:translate(-50%);border-radius:50%;box-shadow:0 4px 8px #a1a1aa30;overflow:hidden;transition:border-radius .5s,width .5s,height .5s,transform .5s;background:#222}.malCard-container:hover .profile-img{width:230px;height:230px;border-radius:20px}.profile-img img{width:100%;height:auto;display:block;cursor:pointer}.contents{position:absolute;padding-top:120px;display:flex;flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;text-align:center;font-family:Source Code Pro,monospace}.userName{font-weight:700;font-size:1.3em;color:#818cf8;text-decoration:none}.daysWatched{font-size:.8em;color:#fff}.data{opacity:0;transition:opacity 1s ease-in-out}.malCard-container:hover .data{opacity:1}.loader{border:16px solid #f3f3f3;border-radius:50%;border-top:16px solid #3498db;width:120px;height:120px;-webkit-animation:spin 2s linear infinite;animation:spin 2s linear infinite}
