.home-container{height:100svh;width:100vw;display:flex;flex-direction:column;justify-content:center;color:var(--header-color);background-color:transparent;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.background{height:100%;width:100%;background:var(--background-image);background-size:85%;background-position:50% 110%;position:fixed;opacity:.15;z-index:-1}@media (max-width:1000px){.background{background-size:160%;background-position:12.5% 50%}}.home--title{--r: 2em;padding-right:55vw;line-height:1.8;clip-path:polygon(-100vw 0,100% 0,calc(100% - var(--r)) 50%,100% 100%,-100vw 100%);background-color:var(--main-color);width:fit-content;z-index:10;transform:translate(-100px)}.home--title>h1{font-size:4rem;font-weight:700;padding-left:1.8em;color:var(--header-color)}.home--title>h1:before{content:"MAR"}.home--content{margin-right:auto;display:flex;flex-direction:column;padding:.5em 0 1em 1.2em}.home--content>p{font-size:1.5rem;font-weight:500;line-height:1.5;letter-spacing:0;margin-right:3em}.get-started{text-decoration:none;padding:.75em 1em;margin:1em auto 0 0;border-radius:8px;font-size:1.2rem;font-weight:600;letter-spacing:.2px;color:var(--header-color);background-color:var(--main-color);transition:transform .25s ease;-webkit-transition:transform .25s ease}.get-started:hover{transform:scale(1.1)}.get-started:visited{color:var(--header-color)}@media (max-width: 550px){.home--title{padding-right:45vw}}@media (min-width: 1100px){.home--title{padding-right:10vw}.home--title>h1:before{content:"MyAnimeRecommendations"}}.slide-in-animation{animation:ribbon-slide-in 1.5s forwards;-webkit-animation:ribbon-slide-in 1.5s forwards;-o-animation:ribbon-slide-in 1.5s forwards;-moz-animation:ribbon-slide-in 1.5s forwards}.slide-out-animation{animation:ribbon-slide-out 2s forwards;-webkit-animation:ribbon-slide-out 2s forwards;-o-animation:ribbon-slide-out 2s forwards;-moz-animation:ribbon-slide-out 2s forwards}.fade-in-animation{opacity:0;animation:title-fade-in .5s forwards;-webkit-animation:title-fade-in .5s forwards;-o-animation:title-fade-in .5s forwards;-moz-animation:title-fade-in .5s forwards;animation-delay:1.5s;-webkit-animation-delay:1.5s;-o-animation-delay:1.5s;-moz-animation-delay:1.5s}.fade-out-animation{opacity:1;animation:title-fade-out .5s forwards;-webkit-animation:title-fade-out .5s forwards;-o-animation:title-fade-out .5s forwards;-moz-animation:title-fade-out .5s forwards}@keyframes ribbon-slide-in{0%{transform:translate(-2000px)}to{transform:translate(-100px)}}@keyframes ribbon-slide-out{0%{transform:translate(-100px)}50%{transform:translate(-20px)}to{transform:translate(-2000px)}}@keyframes title-fade-in{to{opacity:1}}@keyframes title-fade-out{to{opacity:0}}.center-form{width:90%;max-width:600px;margin:auto;padding:1em 0}.form-card{width:100%;margin:0 auto;padding:2em;border-radius:12px;background-color:var(--form-background-color);border:5px solid var(--main-color)}form{margin-top:1em;display:flex;flex-direction:column;padding-bottom:2em;color:var(--text-color);border-bottom:3px solid var(--main-color)}label{align-self:baseline;margin-top:.5em;font-size:1.2rem}input[type=text],input[type=password],input[type=email]{margin-top:.5em;padding:.75em .5em;border:none;border-radius:6px;background-color:var(--background-color);color:var(--text-color);font-size:1.2rem}input:active,input:focus{outline-color:var(--text-color)}input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,input:-webkit-autofill:active{-webkit-background-clip:text;-webkit-text-fill-color:var(--text-color);transition:background-color 5000s ease-in-out 0s;box-shadow:inset 0 0 20px 20px var(--background-color)}input[type=text]::placeholder,input[type=password]::placeholder,input[type=email]::placeholder{color:gray;font-weight:300}.form-link-container{margin-top:1em;line-height:1.4;color:var(--text-color);text-align:center}.form-link{display:block;text-decoration:underline;font-weight:700;color:var(--main-color)!important;text-decoration:underline!important;text-decoration-color:var(--main-color)!important}.standalone-link{display:inline;margin-top:.5em;font-weight:300;transition:unset;-webkit-transition:unset}.standalone-link:hover{color:var(--main-color)!important}.form-link:hover{text-decoration-color:var(--main-color)}.form-btn{width:100%;margin:2em auto;padding:1em;font-size:1.2rem;font-weight:700;letter-spacing:.2px;border-radius:12px;background-color:var(--main-color);color:#fff}.form-btn:disabled{display:none}.form-card>h1{text-align:center;font-size:2rem;padding-bottom:.5em;border-bottom:3px solid var(--main-color)}form>p{color:red;line-height:1.5;margin-top:.5em}.error-card{width:100%;padding:.5em 2em;background-color:#c54040;position:fixed;left:0;z-index:100;display:flex;justify-content:space-between;column-gap:1em}.error-card>h1{font-size:1.5rem;font-weight:400}.error-card>button{background-color:transparent;border:none;cursor:pointer}.error-card>button:active{background-color:transparent}.error-icon{margin-bottom:-4px;font-weight:300;font-size:28px;color:#fff}.error-visible{display:flex;top:-500px;animation:slide-in 1s forwards}.error-hidden{top:0;animation:slide-out 2s forwards}@keyframes slide-in{to{top:0}}@keyframes slide-out{to{top:-500px;display:none}}.login-container,.register-container,.reset-password-container{height:100%;width:100%;padding:2em 1.5em;z-index:2;display:flex;overflow-y:auto}header{display:flex;align-items:center;justify-content:space-between;width:100%;background-color:var(--header-background-color);color:var(--header-color);position:relative}.floating-header{position:fixed;top:0;left:0;z-index:100}.header-title-container{padding:.625em 1em}.header-title{color:var(--header-color)}.header-title:after{color:var(--header-color);font-size:1.5rem;font-weight:600;content:"MyAnimeRecommendations"}.header-title:visited,.header-title:active{color:var(--header-color)}.center-title{margin:0 auto}.expand-container{width:100%;display:flex}.header-navlist{display:flex;column-gap:2em;list-style:none;margin-right:1em}.navlist-hidden{display:none}.header-button{display:none;background:none;border:none;cursor:pointer}.header-button-icon{font-size:2rem;color:var(--header-color);padding:0;margin-bottom:-.125em}.active{text-decoration:underline}.navlink,.navlink:visited{color:var(--header-color)}.navlink:hover{text-decoration-color:var(--header-color)}@media (max-width: 700px){header{flex-direction:column}.header-title-container{width:100%;display:flex;justify-content:space-between}.header-button{display:block}.header-navlist{width:100%;flex-direction:column;margin:0;border-top:1px solid var(--header-border-color);position:absolute;background-color:var(--header-background-color);top:99%;z-index:1}.navlist-item{display:block;padding:.75em 0;text-align:center;border-bottom:1px solid var(--header-border-color)}.header-title:after{content:"MAR";text-decoration:none}.header-title,.header-title:hover{text-decoration:none}}.card{all:unset;height:82vh;min-height:550px;min-width:300px;background:var(--card-background-color);border-radius:24px;cursor:pointer;position:relative;box-shadow:0 0 10px 2px var(--shadow-color);-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.card-drag{display:flex;margin:auto 0}.swipe-right-animation{animation:swipe-right 8s ease infinite 1.5s;-webkit-animation:swipe-right 8s ease infinite 1.5s;-o-animation:swipe-right 8s ease infinite 1.5s;-moz-animation:swipe-right 8s ease infinite 1.5s}.swipe-left-animation{animation:swipe-left 8s ease infinite 1.5s;-webkit-animation:swipe-left 8s ease infinite 1.5s;-o-animation:swipe-left 8s ease infinite 1.5s;-moz-animation:swipe-left 8s ease infinite 1.5s}@keyframes swipe-right{0%{transform:translate(0) rotate(0)}20%{transform:translate(300px) rotate(15deg)}35%{transform:translate(0) rotate(0)}to{transform:unset}}@keyframes swipe-left{0%{transform:translate(0) rotate(0)}20%{transform:translate(-300px) rotate(-15deg)}35%{transform:translate(0) rotate(0)}to{transform:unset}}.card-visible{opacity:1}.card-hidden{opacity:0}.card-image-frame{height:85%;min-width:300px;width:calc(82vh*.85*(1/1.65));aspect-ratio:1/1.65;overflow:hidden;transition:opacity .25s ease-out;-webkit-transition:opacity .25s ease-out}.card-image{display:block;max-width:inherit;max-height:inherit;width:100%;height:100%;border-radius:24px 24px 0 0;object-fit:fill;background-color:var(--card-background-color)}.card-info{min-width:300px;width:calc(82vh * .85 * (1/1.75));padding:1em;transition:opacity .25s ease-out;-webkit-transition:opacity .25s ease-out}.card-info>h1,.card-info>h2{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.card-info>h2{color:var(--gray-color)}.card-button{background-color:var(--card-background-color);box-shadow:0 0 10px 2px var(--shadow-color);border-radius:50%;padding:.75em;border:none;cursor:pointer;position:absolute;bottom:-2.5em;z-index:1}.card-button:hover{background-color:var(--card-button-hover-color)}.card-button:active{box-shadow:0 0 5px 3px #181818,inset 0 0 5px 5px var(--card-background-color);background-color:#1a1a1a}.card-button-icon{color:inherit;font-size:2.5rem;margin-bottom:-.075em}.mark-button{left:-2.5em;color:red}.checkmark-button{right:-2.5em;color:green}@media (max-width:750px){.card{transform:scale(.9)}.card-image-frame{width:calc((82svh * .85 * (1/1.65)) + 2)}.card-info{width:41svh}}@media (max-width:380px){.card{transform:scale(.85)}}.tip{height:100%;width:100%;position:fixed;top:0;left:0;background:#00000080;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);display:flex;opacity:0;transition:opacity .25s ease}.tip>h1{display:inline-block;margin:auto;padding:1em;text-align:center;color:#f5f5f5}.dropdown-button{min-width:140px;display:flex;gap:1em;padding:.25em .5em;font-family:inherit;font-size:1.5rem;font-weight:400;border:none;border-radius:4px;color:var(--dropdown-color);background-color:var(--dropdown-background-color);cursor:pointer}.dropdown-icon{font-size:1.875rem;margin:0 0 -2px}.dropdown-modal-container{position:absolute;top:0;left:0;height:100%;width:100%;display:none;justify-content:center;align-items:center;background-color:var(--modal-blur-color);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:2}@keyframes modal-fade-in{0%{opacity:0}to{opacity:1}}.dropdown-modal{width:30%;background-color:var(--card-background-color);display:flex;flex-direction:column;margin:auto;gap:1em;border-radius:4px;padding:1.75em}.modal-visible{animation:modal-fade-in .25s ease-out;display:flex}.filter-container{display:flex;gap:1em;flex-wrap:wrap;margin-bottom:1em}.filter-item{background-color:transparent;padding:.25em .75em;border-radius:4px;border:2px solid var(--modal-item-color);cursor:pointer;transition:all .25s ease}.filter-item:hover{border-color:var(--main-color)}.selected-item{border-color:transparent;color:var(--header-color);background-color:var(--main-color)}.modal-title-container{display:flex;margin-bottom:.5em}.close-modal-button{margin-left:auto;background-color:transparent;border:none;border-radius:50%;cursor:pointer}.close-modal-button:hover{background-color:var(--modal-button-hover-color)}.close-modal-icon{margin-bottom:-4px;font-size:2rem;color:var(--white-color)}@media (max-width:750px){.dropdown-button{right:calc(50% - 70px)}}@media (min-width:750px) and (max-width:1200px){.dropdown-modal{width:60%}}@media (max-width:750px){.dropdown-modal{width:80%}}.loader{width:48px;height:48px;border:5px solid grey;border-bottom-color:transparent;border-radius:50%;display:inline-block;box-sizing:border-box;animation:rotation 1s linear infinite;margin:auto}@keyframes rotation{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.animes-container{height:100%;width:100%;display:flex;flex-direction:column;align-items:center;padding-top:1.25em;padding-bottom:.25em;overflow:hidden}.animes-notfound{margin:auto 0;white-space:pre}.animes-notfound>h1{font-weight:300}.animepage-position{position:absolute;top:1em;right:1em}@media (max-width:750px){.animepage-position{position:relative;right:unset;top:unset}}@media (max-height:800px){.animes-container{overflow-y:scroll}}.bubble{color:var(--bubble-color);background-color:var(--bubble-background-color);padding:.5em 1em;border-radius:8px;font-size:1.15rem;font-weight:400;letter-spacing:.5px;box-shadow:0 17px 10px -10px var(--icon-shadow-color)}.red{background-color:#c12c31}.green{background-color:#0c860c}.blue{background-color:#274db7}.purple{background-color:#851085}.pink{background-color:#dba3ac}.cyan{background-color:#129698}.blue-violet{background-color:#7025b6}.brown{background-color:#a53f2a}.gray{background-color:#302c2c}.gray-light{background-color:#605a5a}.orange{background-color:#c87801}.gold{background-color:#c0a300}.wine{background-color:#761837}.green2{background-color:#187641}.blood{background-color:#971805}.type-card{position:absolute;right:2em;top:2em;font-weight:700;letter-spacing:.5px;border-radius:8px}.type-details{position:absolute;right:1em;top:1em;font-weight:700;letter-spacing:.5px;border-radius:8px}.details-container{height:90%;width:85%;max-width:1300px;display:flex;flex-direction:column;margin:auto;padding:1.25em 1em;border-radius:16px;background:linear-gradient(135deg,var(--card-background-color) 25%,var(--card-background-color2));box-shadow:0 0 10px 2px var(--shadow-color)}.details-anime-container{height:100%;display:flex;column-gap:2em;margin-top:1em;padding:0 1em .75em;overflow-y:auto;overflow-x:hidden;scrollbar-color:var(--scrollbar-color) var(--scrollbar-background-color)}.details-anime-container::-webkit-scrollbar-thumb{background:var(--scrollbar-color)}.details-anime-container::-webkit-scrollbar-track{background:var(--scrollbar-background-color)}.details-img-frame{height:100%;aspect-ratio:1/1.65;max-width:calc((85vw - 5em)/2)}.details-img-frame>img{display:block;max-width:inherit;max-height:inherit;height:100%;width:100%;border-radius:8px}.rating-span{font-size:1.5rem;display:flex;gap:.25em;margin-left:auto}.rating-icon{color:gold}.details-info-container{width:100%;display:flex;flex-direction:column;gap:1em}.details-info-container>h1{display:flex;gap:1em}.year-span{font-weight:500}.year-header{margin-top:1.5em}.studio-span{font-weight:500}.bubbles-container{display:flex;gap:1em;flex-wrap:wrap;margin-bottom:1.75em}.platforms-header{margin-top:auto}.platforms-container{display:flex;gap:1.25em;flex-wrap:wrap;margin-left:.25em;margin-bottom:.5em}.platform-icon{transition:transform .5s ease;-webkit-transition:transform .5s ease}.platform-icon:hover{transform:scale(1.2)}.platform-icon>img{height:60px;width:60px;border-radius:8px;box-shadow:0 17px 10px -10px var(--icon-shadow-color)}.mal-icon{width:60px;transition:transform .5s ease;-webkit-transition:transform .5s ease}.mal-icon:hover{transform:scale(1.2)}.mal-icon>img{height:60px;width:60px;border-radius:8px;box-shadow:0 17px 10px -10px var(--icon-shadow-color)}.empty-space{min-height:.25em;width:1px}.details-buttons{display:flex;justify-content:space-between}.details-button,.details-button:visited{color:var(--details-button-color)}.details-button-icon{font-size:2.5rem}@media (max-width:750px){.details-container{height:100%;width:100%;padding:1.25em 1em 0;background:unset;border-radius:unset;box-shadow:unset}.complete-screen{height:100%}.details-anime-container{display:flex;flex-direction:column;row-gap:1em;margin-top:1em;padding:.5em .5em .75em}.details-img-frame{max-height:500px;max-width:calc(500px * (1/1.65));align-self:center}.details-info-container{margin-top:.5em}}@media (min-height:1100px) and (max-width:1100px){.details-img-frame{max-height:550px}}@media (min-width:750px) and (max-width:1100px){.details-img-frame{max-height:500px}}.image-container{height:calc((100vh - 11rem)/2);min-width:calc((100vh - 11rem)/2*.85/1.4);max-width:calc((100vh - 11rem)/2*.85/1.4);display:flex;flex-direction:column;border-radius:8px;background-color:var(--card-background-color);transition:transform .4s ease,box-shadow .4s ease;-webkit-transition:transform .4s ease,box-shadow .4s ease;box-shadow:0 0 10px 2px var(--shadow-color)}.image-container:hover{text-decoration:none;transform:scale(1.1);box-shadow:0 0 10px 5px var(--shadow-color)}.image-container>img{display:block;max-width:inherit;max-height:inherit;width:100%;height:85%;aspect-ratio:1/1.4;border-radius:8px 8px 0 0}.imgcard-title-container{height:100%;display:flex;flex-direction:column;justify-content:center;padding:0 .5em}.imgcard-title-container>h1{font-size:calc(((100svh - 11rem)/2)/1.4/14);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.imagecard-hidden{visibility:hidden}@media (max-width:750px){.image-container{height:calc((100svh - 22rem)/2);min-width:calc((100svh - 22rem)/2*.85/1.4);max-width:calc((100svh - 22rem)/2*.85/1.4)}.image-container:hover{text-decoration:none;transform:scale(1);box-shadow:0 0 10px 5px var(--shadow-color)}}.watchlist-container{min-height:calc(100svh - var(--header-height));height:100%;width:100vw;display:flex;flex-direction:column;padding:16px 32px;gap:1em;background-color:var(--background-color);overflow-y:scroll}.watchlist-container>h1{padding-left:.25em;margin-bottom:.25em}.img-cards-container{width:100%;display:flex;flex-wrap:wrap;justify-content:center;gap:2em}.watchlist-bottom-padding{width:100%;min-height:1em;margin-top:2em;background-color:var(--background-color)}.empty-animes{height:100%;width:100%;display:flex;justify-content:center;align-items:center}@media (max-width:750px){.watchlist-container{padding:1em .5em 0}.img-cards-container{gap:1em}}.not-found-container{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:1em;padding:1em;height:100svh;width:100%}.not-found-link{color:var(--text-color);background-color:var(--main-color);padding:.5em 1.5em;border-radius:12px;text-decoration:none}.not-found-link:active,.not-found-link:visited{color:var(--text-color);text-decoration:none}.account-recovery-container{height:100%;width:100%;padding:2em 1.5em;z-index:2;display:flex;overflow-y:auto}*,*:before,*:after{box-sizing:border-box;-webkit-tap-highlight-color:transparent;margin:0;padding:0}*:visited{color:unset;text-decoration:unset}img{pointer-events:none}:root{--main-color: #2E50A2;--secondary-color: #f84926;--background-color: whitesmoke;--text-color: rgb(50,50,50);--gray-color: rgb(147, 147, 147);--header-color: whitesmoke;--header-background-color: #2E50A2;--header-border-color: rgb(200, 200, 200);--card-background-color: white;--card-background-color2: white;--card-button-hover-color: rgb(245,245,245);--scrollbar-color: rgb(185,185,185);--scrollbar-background-color: transparent;--bubble-color: white;--bubble-background-color: grey;--dropdown-color: white;--dropdown-background-color: #2E50A2;--modal-blur-color: #15151584;--modal-item-color: rgb(168, 168, 168);--modal-button-hover-color: rgb(235,235,235);--form-background-color:rgb(225,225,225);--header-height: 3.5rem;--shadow-color: gray;--icon-shadow-color: rgba(0,0,0,.35);--details-button-color: gray;--background-image: url(../../assets/images/background.jpeg) }@media (prefers-color-scheme: dark) or (prefers-dark-interface){:root{--main-color: #f84926;--secondary-color: #2E50A2;--background-color: #151515;--text-color: white;--gray-color: rgb(147, 147, 147);--header-color: whitesmoke;--header-background-color: #202020;--header-border-color: rgb(200, 200, 200);--card-background-color: #2d2d2d;--card-background-color2: rgb(26, 26, 26);--card-button-hover-color: rgb(51, 51, 51);--scrollbar-color: rgb(26, 26, 26);--scrollbar-background-color: #2d2d2d;--bubble-color: white;--bubble-background-color: grey;--dropdown-color: white;--dropdown-background-color: #2d2d2d;--modal-blur-color: #15151584;--modal-item-color: rgb(168, 168, 168);--modal-button-hover-color: rgb(53, 53, 53);--form-background-color:#242424;--header-height: 3.5rem;--shadow-color: black;--icon-shadow-color: rgba(0, 0, 0, .8);--details-button-color: white;--background-image: url(../../assets/images/background.jpeg) }}html,body{font-family:Raleway,sans-serif;line-height:1.2}#root,body{min-height:100svh;background-color:var(--background-color)}:root{--svh: 100svh }main{height:calc(var(--svh) - var(--header-height));width:100%;color:var(--text-color);position:relative;display:flex}h1,h2,h3,h4,p{color:var(--text-color)}a{font-size:1.25rem;font-weight:400;text-decoration-color:transparent;transition:text-decoration-color .5s ease}h1{font-size:1.875rem}h2{font-size:1.25rem}p{font-size:1.25rem;letter-spacing:.5px;line-height:1.3}button{border:none;background-color:transparent;color:var(--text-color);cursor:pointer}@media (min-width: 700px){a:hover{text-decoration-color:var(--text-color)}}
